Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Relayjs Graphql user authentication

Is it possible to authenticate users with different roles solely trough a graphql server in combination with relay & react?

I looked around, and couldn't find much info about this topic.

In my current setup, the login features with different roles, are still going trough a traditional REST API... ('secured' with json web tokens).

like image 204
Seneca Avatar asked Oct 10 '15 11:10

Seneca


People also ask

How do you authenticate in GraphQL?

Authenticating GraphQL is quite simple. We make use of queries and mutations. For a user to have access he has to register first, that's why we have register pages on almost all websites. The registration hits a particular endpoint, for example, it is usually like this https://URL_HERE/register API in a REST endpoint.

Does GraphQL have authentication?

Control access to your GraphQL APIAuthentication is determining whether a given user is logged in, and subsequently determining which user someone is. Authorization is then determining what a given user has permission to do or see.

Is login a mutation GraphQL?

signup and login are two regular GraphQL mutations we can use in the same way as we did with the createLink mutation from before.

Should I use relay GraphQL?

Relay is recommended to use in the frontend to have more structured, modular, future-proofed applications that can scale easily to millions of users. The first thing that needs to be implemented in order to use Relay is to make a Relay-compatible GraphQL server.


1 Answers

I did it in one of my app, basically you just need a User Interface, this one return null on the first root query if nobody is logged in, and you can then update it with a login mutation passing in the credentials. The main problem is to get cookies or session inside the post relay request since it does'nt handle the cookie field in the request.

Here is my client mutation:

 export default class LoginMutation extends Relay.Mutation {
  static fragments = {
    user: () => Relay.QL`
      fragment on User {
        id,
        mail
      }
    `,
  };
  getMutation() {
    return Relay.QL`mutation{Login}`;
  }

  getVariables() {
    return {
      mail: this.props.credentials.pseudo,
      password: this.props.credentials.password,
    };
  }
  getConfigs() {
    return [{
      type: 'FIELDS_CHANGE',
      fieldIDs: {
        user: this.props.user.id,
      }
    }];
  }
  getOptimisticResponse() {
    return {
      mail: this.props.credentials.pseudo,
    };
  }
  getFatQuery() {
    return Relay.QL`
    fragment on LoginPayload {
      user {
        userID,
        mail
      }
    }
    `;
  }
}

and here is my schema side mutation

var LoginMutation = mutationWithClientMutationId({
  name: 'Login',
  inputFields: {
    mail: {
      type: new GraphQLNonNull(GraphQLString)
    },
    password: {
      type: new GraphQLNonNull(GraphQLString)
    }
  },
  outputFields: {
    user: {
      type: GraphQLUser,
      resolve: (newUser) => newUser
    }
  },
  mutateAndGetPayload: (credentials, {
    rootValue
  }) => co(function*() {
    var newUser = yield getUserByCredentials(credentials, rootValue);
    console.log('schema:loginmutation');
    delete newUser.id;
    return newUser;
  })
});

to keep my users logged through page refresh I send my own request and fill it with a cookie field... This is for now the only way to make it work...

like image 90
Duduche Avatar answered Sep 21 '22 05:09

Duduche