Cotter
  • 🚀Getting Started
  • Features & Concepts
    • 💬Sign In with Email/Phone Number
    • 🔐Sign In with Device
      • How it works
    • 🧬Sign In with WebAuthn
  • 📌Quickstart Guides
    • All Guides & Tutorials
    • HTML – Sign in with Email/Phone
    • React – Sign in with Email/Phone
    • React – WebAuthn
    • ▲ Next.js
    • Angular
    • Webflow
    • Bubble.io
    • Python SDK for a CLI
    • React Native – Sign in with Device
    • iOS – Sign in with Device
    • Flutter – Sign in with Device
  • 📘SDK Reference
    • Web
      • Sign In with Email/Phone Number
        • Customize the Form
        • Checking the email or phone before sending a verification code
        • Sending Code or Link via WhatsApp
        • Styling
        • Older SDK
          • Customize the Form
      • Sign in with Social Login
        • Getting Access Tokens from Social Login Providers
        • Github Instructions
        • Google Instructions
      • Sign In with WebAuthn
        • Register WebAuthn for a logged-in user
      • Sign In with Device
        • Steps for Pop Up Authentication Prompt
        • Advanced Customization for Login Form
        • Advanced Customization for Pop Up Authentication Prompt
      • Getting Access Token and Logged-In User Info
      • Sending Successful Form Submission
      • FAQ & Troubleshooting
    • React Native
      • Installation
      • Sign In with Device
        • Add Email/Phone Verification
        • Authenticate from a Non-Trusted Device
        • Add a new Trusted Device
        • Remove Trusted Device
      • Sign In with Email/Phone Number
      • Getting Stored OAuth Tokens and User Information
      • FAQ
      • Older SDK Versions
        • Sign in with Email/Phone
        • Sending Code via WhatsApp
        • Sign In with Device
          • Authenticate from a Non-Trusted Device
          • Add a new Trusted Device
          • Customization
    • Flutter
      • Sign In with Device
        • Add Email/Phone Verification
        • Authenticate from a Non-Trusted Device
      • Sign in with Email/Phone Number
      • Getting the Logged-in User
      • Getting OAuth Tokens
      • Signing a User Out
    • iOS
      • Sign In with Email/Phone Number
      • Sign In with Device
        • Authenticate from a Non-Trusted Device
        • Push Notification
        • Check if Trusted Device is Enrolled
        • Add a New Trusted Device
        • Remove Trusted Device
      • Older Versions
        • Biometric/Pin
    • Android
      • Sign In with Device
        • Authenticate from a Non-Trusted Device
        • Check if Trusted Device is Enrolled
        • Add a new Trusted Device
        • Remove Trusted Device
        • Customization
      • Sign In with Email/Phone Number
      • Biometric/Pin
        • Advanced Methods
        • Customization
        • Setting Strings
        • Styling
      • Older SDK Version
        • Sign In with Device
          • Authenticate from a Non-Trusted Device
    • Python (for CLI)
    • API for Other Mobile Apps or CLI
      • Verify Email/Phone Number
        • Handling URL Scheme
    • Backend: Handling Response
  • 🛡️ Protecting Your Account
    • Only Allow Your Website/App to Use Your API Key
    • Rate Limit
    • Enable reCAPTCHA to Protect Against Automated Abuse
  • 🗝️ Getting Access Token
    • Cotter's OAuth 2.0 Tokens Specification
    • Getting the Tokens
      • Get Tokens during Authentication
      • Using the Refresh Token
    • Storing and Removing Tokens
    • Renewing Expired Tokens
    • Verifying JWT Tokens
    • Requesting Custom Fields on your JWT Token
    • Older API
      • Using HTTP Requests
      • Getting the Tokens
        • During Authentication
          • During Email/Phone Verification
        • During enrolling Trusted Devices
  • 🔌API Reference
    • User API
      • User Object
    • OAuth Tokens API
      • Verify JWT Token using API (serverless)
      • Requesting Custom Claims on your Access Token
      • Older API
    • OAuth Tokens from Social Login
    • Event Object
    • Reset PIN API
  • Older API
    • Validating Cotter's Identity Token
    • Validating Cotter's Event Response
Powered by GitBook
On this page
  • Get Access Token
  • Get Logged-in User
  • Log Out
  • Update Refresh Token (for Custom Claims)
  • OAuth Token Specification
  1. SDK Reference
  2. Web

Getting Access Token and Logged-In User Info

PreviousAdvanced Customization for Pop Up Authentication PromptNextSending Successful Form Submission

Last updated 4 years ago

The following guide only works with that can be installed using:

yarn add cotter

<!-- or -->

npm i cotter --save

<!-- or -->

<script
    src="https://unpkg.com/cotter@0.3.17/dist/cotter.min.js"
    type="text/javascript"
></script>

This feature is not supported on imports using

<script src="https://js.cotter.app/lib/cotter.js" type="text/javascript"></script>

Get Access Token

After the user Authenticates, the SDK automatically stores the Access Token and Refresh Token for your convenience. To get the access token:

var cotter = new Cotter(API_KEY_ID)
cotter.tokenHandler.getAccessToken().then(tok => {
  console.log(tok)
})

Get Logged-in User

After the user Authenticates, the SDK automatically stores the User Information. To get that information:

var cotter = new Cotter(API_KEY_ID)
var user = cotter.getLoggedInUser()
console.log(user)

Log Out

To log out and remove these data, do the following:

var cotter = new Cotter(API_KEY_ID)
await cotter.logOut()

Update Refresh Token (for Custom Claims)

version >= 0.3.24

var cotter = new Cotter(API_KEY_ID)
const resp = await cotter.tokenHandler.updateTokensWithRefreshToken(newRefreshTok)

console.log(resp)
// resp:
{
   "access_token": "eyJhbGciOiJFUzI1NiIsImtpZCI6IlNQQUNFX0pXVF9QVUJMSUM6ODAyOEFBQTMtRUMyRC00QkFBLUJFN0EtN0M4MzU5Q0NCOUY5IiwidHlwIjoiSldUIn0.eyJhZGRyZXNzIjoiSEVsbG9vIiwiYWdlIjoxMjUsImF1ZCI6IjQ3Nzc1YTllLWY1OTktNDk5OS1iNmVhLWY5MDEzMTVhZDMxYiIsImF1dGhlbnRpY2F0aW9uX21ldGhvZCI6Ik9UUCIsImNsaWVudF91c2VyX2lkIjoiZWNhZGJkMmMtNTZmOC00MDc4LWI0NWQtZjE3Nzg2ZWQ0OTllIiwiZXhwIjoxNjA0NjMxMzAyLCJpYXQiOjE2MDQ2Mjc3MDIsImlkZW50aWZpZXIiOiJwdXRyaWthcnVuaWFuQGdtYWlsLmNvbSIsImlzcyI6Imh0dHBzOi8vd3d3LmNvdHRlci5hcHAiLCJqdGkiOiIwZjMzNWI0Yi1mYTk5LTRjOWMtOTIwNS1hNmVlYzA3MjA4YzMiLCJuYW1lIjoiUHV0cmkiLCJzY29wZSI6ImFjY2VzcyIsInN1YiI6ImVjYWRiZDJjLTU2ZjgtNDA3OC1iNDVkLWYxNzc4NmVkNDk5ZSIsInR5cGUiOiJhY2Nlc3NfdG9rZW4ifQ.l5jEBYQnbkPQsahBQSmQhOx4DZhto5UIXVTMm3ODcuYTxQOHdWvc2tmlslvUM6huRO5j4d1VCzh9UFpA4zGqTQ",
   "id_token": "eyJhbGciOiJFUzI1NiIsImtpZCI6IlNQQUNFX0pXVF9QVUJMSUM6ODAyOEFBQTMtRUMyRC00QkFBLUJFN0EtN0M4MzU5Q0NCOUY5IiwidHlwIjoiSldUIn0.eyJhZGRyZXNzIjoiSEVsbG9vIiwiYWdlIjoxMjUsImF1ZCI6IjQ3Nzc1YTllLWY1OTktNDk5OS1iNmVhLWY5MDEzMTVhZDMxYiIsImF1dGhfdGltZSI6IjE2MDQ2Mjc2OTYiLCJjbGllbnRfdXNlcl9pZCI6ImVjYWRiZDJjLTU2ZjgtNDA3OC1iNDVkLWYxNzc4NmVkNDk5ZSIsImV4cCI6MTYwNDYzMTMwMiwiaWF0IjoxNjA0NjI3NzAyLCJpZGVudGlmaWVyIjoicHV0cmlrYXJ1bmlhbkBnbWFpbC5jb20iLCJpc3MiOiJodHRwczovL3d3dy5jb3R0ZXIuYXBwIiwianRpIjoiMmNmMDE4NTEtNTQyZC00YjZjLTkzZmItZmM5YWUwODQxN2NjIiwibmFtZSI6IlB1dHJpIiwic3ViIjoiZWNhZGJkMmMtNTZmOC00MDc4LWI0NWQtZjE3Nzg2ZWQ0OTllIiwidHlwZSI6ImlkX3Rva2VuIn0.PZmaMOjEySln6ujOLeCwYc8Gn2QX4r6cgvt2DnJPJ67cOEBvOWLBc28wgnGGIFq3PIpIAtkg3z2Sv6PfZSodeQ",
   "refresh_token": "75063:kisZxVuaTy9LrkzmzXTrmtV1dH7ACYJ951GR99fV86n1CTIOMB",
   "expires_in": 3600,
   "token_type": "Bearer",
   "auth_method": "OTP"
}

After calling this method, it will automatically update all the access_token, id_token and refresh_token with the new value.

This means, when you call cotter.tokenHandler.getAccessToken() next, you'll get an access token that has all the custom attributes.

New Logins will not have the custom claims ​because we don't attach the custom claims to the user itself.

OAuth Token Specification

This function automatically refreshes the access token if it's expired. The returned access token would be in the form of a object which contains both the string and the decoded token.

If you used this , and you received a new refresh_token , you can update the refresh token stored in the user's browser by calling this method:

Access tokens and id tokens that are generated using this refresh token and will always have the custom claims.

📘
Cotter's NPM package
CotterAccessToken
API to get custom claims
Cotter's OAuth 2.0 Tokens Specification
subsequently returned refresh token