Hi Auth0 Community,
I’m building a React web app using the @auth0/auth0-react library. Users of this app are only allowed to authenticate with Google OAuth2. After initial authentication, users have the option to connect to Gmail. That is, they can give https://www.googleapis.com/auth/gmail.readonly scope access. These flows both rely on Auth0.
My implementation involves two nested Auth0Provider
components, one for the initial login and a second for adding Gmail access. Below are the options I pass to each:
export const googleProviderConfig = {
context: GoogleAuth0ProviderContext,
domain: process.env.REACT_APP_AUTH0_DOMAIN,
clientId: process.env.REACT_APP_AUTH0_CLIENT_ID,
authorizationParams: {
audience: process.env.REACT_APP_AUTH0_AUDIENCE,
redirectUri: `${window.location.origin}?primary`,
scope: "openid profile",
connection: "google-oauth2",
},
skipRedirectCallback: window.location.href.includes("?gmail"),
};
export const gmailProviderConfig = {
context: GmailAuth0ProviderContext,
domain: process.env.REACT_APP_AUTH0_DOMAIN,
clientId: process.env.REACT_APP_AUTH0_CLIENT_ID,
authorizationParams: {
redirectUri: `${window.location.origin}?gmail`,
scope: "openid profile",
connection: "google-oauth2",
connection_scope: "https://www.googleapis.com/auth/gmail.readonly",
access_type: "offline",
// prompt: "select_account",
prompt: "select_account consent",
},
skipRedirectCallback: window.location.href.includes("?primary"),
};
As I’ve implemented the flows, everything works well, with one exception. The problem happens when my app needs to get the offline access refresh token again for some reason. My app can let the user know the connection is broken and display a “Connect with Gmail” button. However, after the auth flow, there is no new refresh token unless I include prompt: “consent”
. This is fine, I don’t mind asking users to review the Google Gmail consent screen again. The problem is that when I include prompt: “consent”
I also get the Auth0 consent screen:
And, this screen is confusing for users…
I’ve seen other posts in which folks had similar issues. For example:
However, I’ve already got the suggested solutions in place—specifically, no references to localhost in Allowed Callback URLs.
I’d appreciate any suggestions. I’m also happy to post more of the code or a link to a demo if the community needs more detail. Also, if there is sample code for achieving the incremental scope increases for Google, I’d appreciate a link, so I can compare my code.
Thanks,
John