Authenticate a User with a GraphQL Mutation

Eve Porcello
InstructorEve Porcello
Share this video with your friends

Social Share Links

Send Tweet
Published 5 years ago
Updated 4 years ago

Mutations give you the ability to invoke backend functions from the client. In this lesson, we will use a mutation to authenticate a user with their username and password. Authorized users will receive a token that can be used to identify the current user in future operations.

To follow along with these queries, go to the Pet Library GraphQL Playground.

Instructor: [00:00] Now that we have an account, we can log in. Let's look at our mutation's list. We should see that there is a logIn mutation. I'm going to go ahead and write that here in our query document. We'll use logIn with the capital I. We'll use our username, our password.

[00:16] What's returned from the logIn mutation is a type called the logIn payload. This is a custom object that returns both the customer, all the of the customer details, and the user token. We're going to use the user token to validate that the user is authorized.

[00:31] When we send the logIn mutation, we're going to have access to all of the customer details. Grab their name. We're going to grab the token.

[00:40] Let's go ahead and hit play. We see our customer name, which is my name that I provided when I created my account. I also see my token. We're going to place this in another panel here at the bottom called HTTP headers.

[00:53] Now, this is easy to get mixed up with query variables. We'll make sure that we're in the HTTP header section and we'll add the authorization key. We'll add Baer. We'll paste in this token.

[01:07] Once I provide this token in the HTTP headers, I'm going to be able to send queries that are only for authorized uses. Now the query I am going to send here is called "Me". Me is going to give me information about myself, the currently authenticated user.

[01:23] The Me query returns customer details for anyone who's logged in. Here I'll query the name field. I'm going to add an operation name, because I have two different operations here in my query document. I'll call query Me, and I'll call the mutation logIn.

[01:37] Now, I can send this query and I should see all of the details for myself, because I am a logged in user. Since I'm logged in, I'll be able to check in and check out pets.

ganesh arumugam
ganesh arumugam
~ 3 years ago

I am not able to run the mutation and query as part of the same document since login token is refreshed with new value every time it runs. So it makes it invalid for the Me query.

~ 3 years ago

I tried to add variables with my username and password to log in, but it didn't work

"message": "Unknown type "username".",

//Code mutation($myusername: username $mypassword: password) { logIn(username: $myusername password: $mypassword) { customer { name } token } }

//Variables { "myusername": "hahaha", "mypassword": "yes" }

Eve Porcello
Eve Porcelloinstructor
~ 3 years ago

I tried to add variables with my username and password to log in, but it didn't work

"message": "Unknown type "username".",

//Code mutation($myusername: username $mypassword: password) { logIn(username: $myusername password: $mypassword) { customer { name } token } }

//Variables { "myusername": "hahaha", "mypassword": "yes" }

Hello! Make sure that you're using the type correctly in the mutation as the variable. The change you'd need to make is on line 1 of the mutation:

mutation($myusername: ID!, $mypassword: String!) {
  logIn(username: $myusername, password: $mypassword) {
    customer {
      name
    }
    token
  }
}
Jayden
Jayden
~ 3 years ago

Account with that username: ep123 not found.".

What should I do with this error?

Eve Porcello
Eve Porcelloinstructor
~ 3 years ago

Hi Jayden, you just need to create your own account to log in. You can watch the previous video for instructions on how to create an account, and then log in with those details in this video.

Thanks!

Markdown supported.
Become a member to join the discussionEnroll Today