Is that possible to implement more than one auth provider?
Is that possible to implement more than one auth provider? At the moment i have only google authentication. But I would also like to implement the authentication where the user can register with a username and a password.
7 Replies
Hi @ging_freecs. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
Yes, it is possible to implement more than one authentication method in your refine application. You can have Google authentication along with email and password-based authentication. You'll need to modify your
authProvider
to handle both methods.
In the authProvider example (https://refine.dev/blog/refine-pixels-2#<Refine />'s authProvider
Prop) provided in the extracts, you can see that it already handles email and password-based authentication. You can extend this example to include Google authentication as well.
To add Google authentication, you can follow the example from the NextAuth Google and GitHub authentication (https://refine.dev/blog/nextauth-google-github-authentication-nextjs) extract. Although the example is for Next.js, you can adapt the logic for your refine application.
In your authProvider
, you'll need to add a new case for Google authentication in the login
method. You can use a third-party library or your custom implementation to handle the Google authentication process.
Here's a modified version of the authProvider
example that includes a placeholder for Google authentication:
NextAuth - Google And GitHub Authentications for Nextjs | refine
How to implement Google and GitHub authentications using NextAuth.js in Next.js?
Setting Up the Client App | refine
We'll initialize our Pixels app using refine and get familiar with the boilerplate code to be created with the create refine-app CLI tool.
Remember to replace the placeholder with your actual Google authentication logic.
----------------------
Note: you can ask me a follow up question by @ mentioning me again
:speech_balloon:
----------------------<@296624290843983873> kapa.ai is still learning and improving, please let us how it did by reacting below
harsh-harlequin•16mo ago
Hello @ging_freecs , was the answer you got from bot sufficient, or do you need and follow-up?
passive-yellow•16mo ago
Hi, i would like a follow up. i don't know how to implement more than one
harsh-harlequin•16mo ago
Hello @ging_freecs You can pass extra providers like seen here: https://refine.dev/docs/api-reference/mui/components/mui-auth-page/#providers
ANd as bot mentioned, you can have condition inside auth provider,
| refine
component from refine is an authentication page that can be used to login, register, forgot password, and update password.