GoTrue JS Demo Site

You can test out the authentication methods with your own site. Take a peek at the source code or deploy a copy to Netlify to play around with the code by yourself.

Authentication methods

Sign up

Create a new user with the specified email and password

Example code

      
auth.signup(email, password)
    .then(response => console.log("Success!Check your inbox! ", response))
    .catch(error => console.log("It 's an error", error));

Example response

                      
  {
    id: 'example-id ',
    aud: ' ',
    role: ' ',
    email: 'example@example.com ',
    confirmation_sent_at: '2018-04-27T22:36:59.636416916Z ',
    app_metadata: { provider: 'email ' },
    user_metadata: null,
    created_at: '2018-04-27T22:36:59.632133283Z ',
    updated_at: '2018-04-27T22:37:00.061039863Z '
  }

Try it out!

Confirm

This function confirms a user sign up via a unique confirmation token.

When a new user signed up, a confirmation email will be sent to the registered email address.
(Make sure Autoconfirm isn't turned on under identity settings.)

In the email, there's a link that says Confirm your email address. When a user clicks on the link, it'll be redirected to the URL of the site including a fragment identifier #confirmation_token=Iyo9xHvsGVbW-9A9v4sDmQ.

For security reason, the confirmation_token is hidden from the browser via a redirect. If you wish to manually confirm a user using the auth.confirm(token) method, copy the link location from the email and use the curl -I script to get the confirmation token in your terminal. For example,

                      
  curl -I https://mandrillapp.com/track/click/30002868/example.netlify.com?p=example-token
  HTTP/1.1 302 Moved Temporarily
  Server: nginx/1.12.2
  Date: Tue, 15 May 2018 21:19:13 GMT
  Content-Type: text/html; charset=utf-8
  Set-Cookie: PHPSESSID=77c421bf85fa412e5f994f28a6b30956; expires=Wed, 16-May-2018 07:19:13 GMT; path=/; secure; HttpOnly
  Expires: Thu, 19 Nov 1981 08:52:00 GMT
  Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0
  Pragma: no-cache
  Set-Cookie: PHPSESSID=77c421bf85fa412e5f994f28a6b30956; expires=Wed, 16-May-2018 07:19:13 GMT; path=/; secure; httponly
  Location: https://example.netlify.com/#confirmation_token=Iyo9xHvsGVbW-9A9v4sDmQ

Example code

                      
auth
  .confirm(token)
  .then(function(response) {
    console.log("Account confirmed!Welcome to the party!", JSON.stringify({ response }));
  })
  .catch(function(e) {
    console.log(e);
  });

Example response

                      
{
  "response": {
    "api": {
      "apiURL": "https://example.netlify.com/.netlify/identity",
      "_sameOrigin": true,
      "defaultHeaders": {}
    },
    "url": "https://example.netlify.com/.netlify/identity",
    "token": {
      "access_token": "example-jwt-token",
      "token_type": "bearer",
      "expires_in": 3600,
      "refresh_token": "example-refresh-token",
      "expires_at": 1526110512000
    },
    "id": "example-id",
    "aud": "",
    "role": "",
    "email": "example@netlify.com",
    "confirmed_at": "2018-05-12T06:35:13Z",
    "confirmation_sent_at": "2018-05-12T06:34:35Z",
    "app_metadata": {
      "provider": "email"
    },
    "user_metadata": {},
    "created_at": "2018-05-12T06:34:35Z",
    "updated_at": "2018-05-12T06:34:35Z"
  }
}

Try it out!

Log in

Handles user login via the specified email and password

Example code

            
auth
  .login(email.value, password.value)
  .then(response => {
    showMessage("Success! Response: " + JSON.stringify({ response }), form);
  })
  .catch(error => showMessage("Failed :( " + JSON.stringify(error), form));

Example response

          
{
  "response": {
    "api": {
      "apiURL": "https://example.netlify.com/.netlify/identity",
      "_sameOrigin": true,
      "defaultHeaders": {}
    },
    "url": "https://example.netlify.com/.netlify/identity",
    "token": {
      "access_token": "example-jwt-token",
      "token_type": "bearer",
      "expires_in": 3600,
      "refresh_token": "example-refresh-token",
      "expires_at": 1526062471000
    },
    "id": "example-id",
    "aud": "",
    "role": "",
    "email": "example@netlify.com",
    "confirmed_at": "2018-05-04T23:57:17Z",
    "app_metadata": {
      "provider": "email"
    },
    "user_metadata": {},
    "created_at": "2018-05-04T23:57:17Z",
    "updated_at": "2018-05-04T23:57:17Z"
  }
}

Try it out!

Request password recovery

This function sends a request to GoTrue API and triggers a password recovery email to the specified email address

Example code

                        
auth
  .requestPasswordRecovery(email)
  .then(response => console.log("Recovery email sent", { response }))
  .catch(error => console.log("Error sending recovery mail: %o", error));

Example response

{}

Try it out!

(Make sure you're logged in!)

Account recovery

This function recovers a user account via a recovery token.

After a user requested password recovery, an email will be sent to their inbox with a reset password link. A user can login into the site again by clicking on the link. Their browser will be redirected to the URL of the site including a fragment identifier recovery_token. For security reason, the recovery_token is hidden from the browser via the redirect. If you wish to test it locally. Use `curl -I` command to substract the recover_token in your terminal. For example,

                        
  curl -I https://mandrillapp.com/track/click/30002868/inspiring-ride-d3b2ae.netlify.com?p=somequery
  HTTP/1.1 302 Moved Temporarily
  Server: nginx/1.12.2
  Date: Wed, 16 May 2018 04:59:31 GMT
  Content-Type: text/html; charset=utf-8
  Set-Cookie: PHPSESSID=3edb0b7b2061868b7dfaf0f5f6cb90ec; expires=Wed, 16-May-2018 14:59:31 GMT; path=/; secure; HttpOnly
  Expires: Thu, 19 Nov 1981 08:52:00 GMT
  Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0
  Pragma: no-cache
  Set-Cookie: PHPSESSID=3edb0b7b2061868b7dfaf0f5f6cb90ec; expires=Wed, 16-May-2018 14:59:31 GMT; path=/; secure; httponly
  Location: https://inspiring-ride-d3b2ae.netlify.com/#recovery_token=sOyUPifHLfbzFet_ioB97w

Example code

                        
auth
  .recover(token)
  .then(response =>
    console.log("Logged in as %s", JSON.stringify({ response }))
  )
  .catch(error => console.log("Failed to verify recover token: %o", error));

Example response

                          
{
  "response": {
    "api": {
      "apiURL": "https://example.netlify.com/.netlify/identity",
      "_sameOrigin": true,
      "defaultHeaders": {}
    },
    "url": "https://example.netlify.com/.netlify/identity",
    "token": {
      "access_token": "example-jwt-token",
      "token_type": "bearer",
      "expires_in": 3600,
      "refresh_token": "example-refresh-token",
      "expires_at": 1526107729000
    },
    "id": "example-id",
    "aud": "",
    "role": "",
    "email": "example@netlify.com",
    "confirmed_at": "2018-05-12T05:48:49Z",
    "invited_at": "2018-05-04T23:40:00Z",
    "recovery_sent_at": "2018-05-12T05:48:13Z",
    "app_metadata": {
      "provider": "email"
    },
    "user_metadata": {},
    "created_at": "2018-05-04T23:40:00Z",
    "updated_at": "2018-05-04T23:40:00Z"
  }
}

Get current user

This function returns the current user object when a user is logged in.

Example code

      
const user = auth.currentUser();

Example response

                          
{
  "api": {
    "apiURL": "https://example.netlify.com/.netlify/identity",
    "_sameOrigin": true,
    "defaultHeaders": {}
  },
  "url": "https://example.netlify.com/.netlify/identity",
  "token": {
    "access_token": "example-token",
    "token_type": "bearer",
    "expires_in": 3600,
    "refresh_token": "v4w7HfB4xfeKW9m8tg",
    "expires_at": 1525214326000
  },
  "id": "example-id",
  "aud": "",
  "role": "",
  "email": "example@example.com",
  "confirmed_at": "2018-05-01T19:21:00Z",
  "app_metadata": {
    "provider": "email"
  },
  "user_metadata": {},
  "created_at": "2018-05-01T19:21:00Z",
  "updated_at": "2018-05-01T19:21:00Z"
}

Try it out!

(Make sure you're logged in)

Update user

This function updates a user object with specified attributes.

Example code

                        
const user = auth.currentUser();

user
  .update({ email: "example@example.com", password: "password" })
  .then(user => console.log("Updated user %s", user))
  .catch(error => {
    console.log("Failed to update user: %o", error);
    throw error;
  });

Example response

                          
{
  "api": {
    "apiURL": "https://example.netlify.com/.netlify/identity",
    "_sameOrigin": true,
    "defaultHeaders": {}
  },
  "url": "https://example.netlify.com/.netlify/identity",
  "token": {
    "access_token": "example-token",
    "token_type": "bearer",
    "expires_in": 3600,
    "refresh_token": "dSkuYfmkph-mxUVtOA5k_Q",
    "expires_at": 1525215471000
  },
  "id": "example-id",
  "aud": "",
  "role": "",
  "email": "example@example.com",
  "confirmed_at": "2018-05-01T19:21:00Z",
  "app_metadata": {
    "provider": "email"
  },
  "user_metadata": {},
  "created_at": "2018-05-01T19:21:00Z",
  "updated_at": "2018-05-01T22:04:07.923944421Z",
  "new_email": "new-example@example.com",
  "email_change_sent_at": "2018-05-01T22:04:07.49197052Z"
}

Try it out!

(Make sure you're logged in)

Get JWT token

This function retrieves a JWT token from a currently logged in user

Example code

      
const jwt = user.jwt();
jwt
  .then(response => console.log("This is a JWT token", response))
  .catch(error => {
    console.log("Error fetching JWT token", error);
    throw error;
  });

Example response

                          
eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE1MjUyMTk4MTYsInN1YiI6ImE5NG.98YDkB6B9JbBlDlqqef2nme2tkAnsi30QVys9aevdCw debugger eval code:1:43

Try it out!

(Make sure you're logged in)

Log out

This function removes the jwt token of the current user from local storage and log the user out.

Example code

                        
const user = auth.currentUser();
user
  .logout()
  .then(response => console.log("User logged out");)
  .catch(error => {
    console.log("Failed to logout user: %o", error);
    throw error;
  });

Try it out!

(Make sure you're logged in)

Netlify GoTrue JS Library

Authentication methods

Sign up

Example code

Example response

Try it out!

Confirm

Example code

Example response

Try it out!

Log in

Example code

Example response

Try it out!

Request password recovery

Example code

Example response

Try it out!

Account recovery

Example code

Example response

Get current user

Example code

Example response

Try it out!

Update user

Example code

Example response

Try it out!

Get JWT token

Example code

Example response

Try it out!

Log out

Example code

Try it out!