I'm using Angular 15 for my web app, and I need to implement Google Sign In functionality to register/login a user with Google credentials. I already set up the app on Google Identity by following this guide, then installed angularx-social-login and also followed the guide there to create the login button.
So in app.module.ts:
{
provide: 'SocialAuthServiceConfig',
useValue: {
autoLogin: false,
providers: [
{
id: GoogleLoginProvider.PROVIDER_ID,
provider: new GoogleLoginProvider(
'MY_CLIENT_ID',
{
oneTapEnabled: false
}
)
}
],
onError: (err) => {
console.error(err);
}
} as SocialAuthServiceConfig,
}
Then I use a custom component, LoginPage, to show the button and other stuff. In login-page.component.html:
<asl-google-signin-button type="icon" text="signin_with" ></asl-google-signin-button>
In login-page.component.ts:
...
ngOnInit(): void {
// Subscribe to google authorization service
this.socialAuthService.authState.subscribe((socialUser) => {
if (socialUser) {
const idToken = socialUser.idToken;
const provider = socialUser.provider;
if (provider == "GOOGLE" && this.canPerformGoogleSignIn) {
this.googleSignIn(idToken);
}
}
});
}
...
googleSignIn(token: string): void {
...
// Register user via Google Sign In (by calling my back-end)
this.authService.signUpWithGoogle(token).subscribe({
next: (jwtAuthenticationResponse: {accessToken:string, refreshToken:string, id:number, email:string}) => {
...
},
complete: () => {
...
},
error: () => {
...
}
});
}
}
This works fine on Mozilla Firefox and Safari, however in other browsers (Brave, Chrome, Edge) when I click the sign in button nothing happens, not even an error on the console.
I tried to search for a solution but I found nothing relevant. Not event the github page for Angular Social Login has issues on that.
If anyone could help me, thanks in advance.