cognito-oauth-library
React library to facilitate oauth flow with AWS Cognito
Install
Npm
npm install --save cognito-oauth-library
Yarn
yarn add cognito-oauth-library
How it works
First you need to pass all required settings to the cognito-oauth-library.
config.jsx
import React from 'react'; import Cognito from 'cognito-oauth-library'; const cognito = clientId: '<Your-Client-Id>' domain: '<Your-Cognito-Domain>' region: '<Your-AWS-Region>' responseType: '<code|implicit>' redirectUri: '<Your-Redirect-Uri'; ;
After this you'll be able to access all components from the library
Components
The components only work inside of a Session Context.
How to use Session Component
This component will provide you every information you need from the
authentication.
It is a Provider
from React Context API and it will allow you to share an
Authentication context along all children components inside <Session/>
SessionComponent.jsx
import React from 'react'; import Session from 'cognito-oauth-library'; import cognito from './config'; <Session => <MyComponent /></Session>
MyComponent.jsx
import React useContext from 'react';import SessionContext from 'cognito-oauth-library'; { const session = ; return <div> <a =>Sign In</a> </div> ;}
How to use Session Context
You can use SessionContext
to get all informations from the authentication
shared context.
Property | Description |
---|---|
cognito_url | Authentication url for Cognito Sign In UI |
user | All data from oauth2/userinfo endpoint |
Context Usage
import React useContext from 'react';import SessionContext from 'cognito-oauth-library'; const session = ;
Api Service
This library also provides you, a Axios
instance with some plus configurations
like, it adds your token
into all requests and when your API
returns 401
error code, it automatically tries to refresh your token.
How to use Api Service
Api.js
; const Api = cognito; ;
With that, you can have access into get
, post
, update
and delete
methods
from Axios
.
License
MIT © dariorlima