Authentication
Crema supports 4 types of authentication methods. Crema supports the following Methods
Crema supports 4 types of authentication methods. Crema supports the following Methods.
- 1.JWT AuthJSON Web Token is a proposed Internet standard for creating data with an optional signature.To integrate JWT Auth you need to follow the following steps.
- 1.Open the
src/@
crema/services/auth/jwt-auth/index.js
file and update baseURL of your server like belowconst jwtAxios = axios.create({baseURL: 'YOUR_API_URL HERE',headers: {'Content-Type': 'application/json',},}); - 2.Wrapp
<AuthRoutes
> with<JWTAuthProvider>
Component in thesrc/pages/_app.js
file like below.const App = () => (<AppContextProvider>...<JWTAuthProvider> //Add the line<AuthRoutes><CssBaseline /><Component {...pageProps} /></AuthRoutes></JWTAuthProvider>...</AppContextProvider>);export default App; - 3.Uncomment the JWT Auth method like below in the
src/@crema/utility/AuthHooks.js
file// ForJWT Authimport {getUserFromJwtAuth} from './helper/AuthHelper';import {useJWTAuth,useJWTAuthActions,} from '../services/auth/jwt-auth/JWTAuthProvider';export const useAuthUser = () => {const {user, isAuthenticated, isLoading} = useJWTAuth();return {isLoading,isAuthenticated,user: getUserFromJwtAuth(user),};};export const useAuthMethod = () => {const {signInUser, signUpUser, logout} = useJWTAuthActions();return {signInUser,logout,signUpUser,};}; - 4.In the final step, we need to call the
<SigninJwtAuth>
tag in thesrc/modules/auth/Signin/index.js
file like below and do the same for Signup.const SignIn = () => {return (<Box>...<SigninJwtAuth />...</Box>);};export default SignIn;
- 2.FirebaseFirebase security applies Google's internal expertise to easily build app sign-ins. Develop simple, free multi-platform sign-in with Firebase Authentication. To integrate Firebase Auth you need to follow the following steps.
- 1.Open the
src/@crema/services/auth/firebase/firebase.js
file and update firebaseConfig for your app like belowconst firebaseConfig = {apiKey: 'XXXXXXXXXXXXXXXXXXX',authDomain: 'XXXXXXXXXX.firebaseapp.com',projectId: 'XXXXXXXXXX',storageBucket: 'XXXXXXXXXX.appspot.com',messagingSenderId: 'XXXXXXXXXX',appId: '1:XXXXXXXXXX:web:XXXXXXXXXX',measurementId: 'G-XXXXXXXXXX',}; - 2.Wrapp
<AuthRoutes
> with<FirebaseAuthProvider>
Component in thesrc/pages/_app.js
file like below.const App = () => (<AppContextProvider>...<FirebaseAuthProvider> //Add the line<AuthRoutes><CssBaseline /><Component {...pageProps} /></AuthRoutes></FirebaseAuthProvider>...</AppContextProvider>);export default App; - 3.Uncomment the Firebase Auth method like below in the
src/@crema/utility/AuthHooks.js
fileimport {useFirebase,useFirebaseActions,} from '../services/auth/firebase/FirebaseAuthProvider';import {getUserFromFirebase} from './helper/AuthHelper';export const useAuthUser = () => {const {user, isAuthenticated, isLoading} = useFirebase();return {isLoading,isAuthenticated,user: getUserFromFirebase(user),};};export const useAuthMethod = () => {const {signInWithEmailAndPassword,createUserWithEmailAndPassword,signInWithPopup,logout,} = useFirebaseActions();return {signInWithEmailAndPassword,createUserWithEmailAndPassword,signInWithPopup,logout,};}; - 4.In the final step, we need to call the
<SigninFirebase>
tag in thesrc/modules/auth/Signin/index.js
file like below and do the same for Signup.const SignIn = () => {return (<Box>...<SigninFirebase />...</Box>);};export default SignIn;
- 3.AWSAmazon Cognito lets you add user sign-up, sign-in, and access control to your web and mobile apps quickly and easily. To integrate AWS Auth you need to follow the following steps.
- 1.Open the
src/@crema/services/auth/aws-cognito/aws-exports.js
file and update awsConfig for your app like belowexport const awsConfig = {aws_project_region: 'us-east-1',aws_cognito_identity_pool_id:'us-east-1:XXXXXXXXXX,aws_cognito_region: 'us-east-1',aws_user_pools_id: 'us-east-XXXXXXXXXX',aws_user_pools_web_client_id: 'XXXXXXXXXX',oauth: {domain: 'XXXXXXXXXX.auth.us-east-1.amazoncognito.com',scope: ['phone','email','openid','profile','aws.cognito.signin.user.admin',],redirectSignIn: 'http://localhost:3000/',redirectSignOut: 'http://localhost:3000/',responseType: 'code',},federationTarget: 'COGNITO_USER_POOLS',}; - 2.Wrapp
<AuthRoutes
> with<AwsAuthProvider>
Component in thesrc/pages/_app.js
file like below.const App = () => (<AppContextProvider>...<AwsAuthProvider> //Add the line<AuthRoutes><CssBaseline /><Component {...pageProps} /></AuthRoutes></AwsAuthProvider>...</AppContextProvider>);export default App; - 3.Uncomment the AWS Auth method like below in the
src/@crema/utility/AuthHooks.js
file