How to setup OAuth properly

altear147

According to this article
https://fusionauth.io/docs/lifecycle/authenticate-users/identity-providers/social/google.

I create Google credentials as this image

[Please repost image]

the first hidden is my web app url.
and the second section hidden is redirected url to my backend service.

then create identity provider as this image

[Please repost Image]

and declare function to login and redirect like this

@Get("oauth/login")
async login(@Req() req: Request, @Res() res: Response) {
const fusionAuthURL = ${process.env.FUSIONAUTH_ISSUER}/oauth2/authorize?client_id=${process.env.FUSIONAUTH_CLIENT_ID}&redirect_uri=${process.env.FUSIONAUTH_REDIRECT_URI}&response_type=code&scope=openid email profile;
return res.redirect(fusionAuthURL);
}

@Get("oauth/callback")
async callback(@Req() req: Request, @Res() res: Response) {
const user = req.user;
return res.redirect(${process.env.FRONTEND_URL});
}

after build and deploy FusionAuth, my web app and backend service I saw login with google button at the Fusionauth admin page.

I try to login with that button, and the error dialog show me that my client id is invalid.

I try to send redirect request from my web app to backend service with the function I mentioned above
it didn't work as well.

May you direct me what I was missing or misunderstanding or what I need to clarify.

thank you in advance.

mark.robustelli

@altear147 Would you mind please reposting the images. I removed them as I felt with a little work some of the private information would have been revealed with them. Please completely block the secret information.

mark.robustelli

@altear147 is the error referring to the FusionAuth application client id or the Google Client Id? Is the error coming form FusionAuth or Google?

altear147

@mark-robustelli
here, the identity provider page and credential page.

the error dialog said the client id is invalid,
I copied the id and secret from the credential page, so I'm pretty sure that there is no error like missing some character or having more character.

and here the error dialog that I mentioned

mark.robustelli

@altear147 Can you please give the full text (minus any secrets) of the error?

altear147

@mark-robustelli

{
"error" : "invalid_client",
"error_description" : "client_id: {secret}.apps.googleusercontent.com is not valid.",
"error_reason" : "invalid_client_id"
}

mark.robustelli

@altear147 can you try to use application Id of the application in FusionAuth for the client_id instead of the google client id and see if that works?

altear147

@mark-robustelli

oh, I changed client id in identity provider to app id,

the error dialog still the same error

{
"error" : "invalid_client",
"error_description" : "client_id: {"still be google client id not app id"}apps.googleusercontent.com is not valid.",
"error_reason" : "invalid_client_id"
}

it seems the id that was shown in the error dialog
is from the web service controller "process.env.FUSIONAUTH_CLIENT_ID"

@Get("oauth/login")
async login(@Req() req: Request, @Res() res: Response) {
const fusionAuthURL = ${process.env.FUSIONAUTH_ISSUER}/oauth2/authorize?client_id=${process.env.FUSIONAUTH_CLIENT_ID}&redirect_uri=${process.env.FUSIONAUTH_REDIRECT_URI}&response_type=code&scope=openid email profile;
return res.redirect(fusionAuthURL);
}

but in credential page isn't complicated.

anyway, I did enable and attemp to login from fusion auth admin page

and got this error.

mark.robustelli

@altear147 OK, let's try this. Go into the FusionAuth AdminUI.

Go to Applications
Find your application
select View
find the OAuth2 & OpenID Connect Integration details section
copy the OAuth IdP login URL

use that for the value of the url. Let me know if that works.

altear147

@mark-robustelli
Hi thank you for replying, and sorry for away a few days due to my group shut down the service during weekend and night time.

I try using url from this "OAuth IdP login URL", as a login function

@Get("oauth/login")
async login(@Req() req: Request, @Res() res: Response) {
const fusionAuthURL = ${process.env.FUSIONAUTH_ISSUER}/oauth2/authorize?client_id=1133784f-7f6e-4eda-a33b-7fd1164f6509&response_type=code&redirect_uri=${"my redirect url"};
return res.redirect(fusionAuthURL);
}

but it returns me
{
"error" : "invalid_request",
"error_description" : "Invalid redirect_uri {my redirect url},
"error_reason" : "invalid_redirect_uri"
}

PS. I replaced the direct url as a "my redirect url".

the value of my direct url is a url path that request to this

@Get("oauth/callback")
async callback(@Req() req: Request, @Res() res: Response) {
const user = req.user;

// skip access token

// res.cookie("token", jwtToken, { httpOnly: true });

return res.redirect(`${process.env.FRONTEND_URL}`);

}

mark.robustelli

@altear147 OK, it looks like the redirect_uri does not match what is configured in the application. Can you make sure you are supplying the correct uri?

This can be found under: Applications -> Edit -> OAuth tab