Thank you so much for this video. I managed to deliver web app within time. One request for you, please make video for sign in with Facebook. Thank you
7:46 This subscription works fine on the first login. However, on subsequent logins (without any page refresh), everything inside the subscription runs once more than the last time. I think it's because somehow the old observable subscription does not go away and thus here, we're ending up subscribing to all previous versions. In that case, my idea was to unsubscribe on login complete (via onDestroy hook). However, that doesn't seem to do much change either. I think before doing that, login page would autologin, which doesn't happen anymore. So that's something. Any idea what the issue could be and how to solve it? Edit: What Id should have done was create a new variable to store the subscription (or assign to an existing variable). Then I can unsubscribe that variable when needed.
Wow! amazing! You saved me hours of trying to figure that out. Can you make a video on how to do it using Firebase to keep the session & use a Firebase database?
Thanks for this video. Loved the explanation. Can you help me understand why we didn't need to use the client secret, which was displayed at time 4:07 in the video?
How do you do authorization? In my case, I can only get access token and each time I do, I have to sign in for some reason, despite already being signed in.
I believe when i was looking into this the angular social login was not working right in Angular 14, Google is also deprecating some older APIs and using a new library for auth and idk if Angular social login is as up to date, im not sure but i saw your video on the topic, and wanted to chime in
Thanks for your response. There's no errors in the console . I inspected the button and saw that it is present in the dom. I wonder why it's not visible in the UI
You have to add origin of your app. If you are running on localhost then it will be localhost:port or if you have a domain, add your domain as origin while configuring the app.
'asl-google-signin-button' is not a known element. this is the error i get, i dont find a fix and i have SocialLoginModule imported in app module. help please
hi brother...it works fine in localhost...but when it come to the live server..it is not working..when i click the button, it just displays white box without any login informations...and in the console it says "m=credential_button_library:44 [GSI_LOGGER]: The given origin is not allowed for the given client ID."..help me to solve it
I found it in the provider configured in your app.module below your id key add provider: new GoogleLoginProvider( environment.googleAuthLoginKey, { oneTapEnabled: false, } )
HI, I am using angula 16 and it's giving me error - src/app/app.component.html:3:1 - error NG8001: 'asl-google-signin-button' is not a known element: 1. If 'asl-google-signin-button' is an Angular component, then verify that it is part of this module.
@@FixItWithAnkit I am still facing the same issue, My Google Console project is GoogleAuthAngularTest, so should I add , but still I am getting error and I have done all things in app.module.ts
Once you receive the details send the token to the backend and it will fetch the google account details using the token and create a user in you database.
Angular 15 Error: asl-google-signin-button' is not a known element If 'asl-google-signin-button' is an Angular component, then verify that it is part of this module.
@@FixItWithAnkit Thanks for your quick reply, Everything was there, we need to import GoogleSigninButtonModule where we are using above directive/component
this video is a gem.. the last few information/tips shared is really appreciated.
thanks for your tutorial, you saved my school's project
Thank you so much professor, i have been problems with the implementation but saw your video and works all! I Send vibes from Argentina!!
fantastic.. very useful.. waiting for your full tutorial. Thank you.
Wow what a great explanation keep doing great work please make a video on fb and twitter login .You are doing great work .
Thank you so much for this video. I managed to deliver web app within time. One request for you, please make video for sign in with Facebook. Thank you
Its in progress
7:46
This subscription works fine on the first login.
However, on subsequent logins (without any page refresh), everything inside the subscription runs once more than the last time.
I think it's because somehow the old observable subscription does not go away and thus here, we're ending up subscribing to all previous versions. In that case, my idea was to unsubscribe on login complete (via onDestroy hook). However, that doesn't seem to do much change either. I think before doing that, login page would autologin, which doesn't happen anymore. So that's something.
Any idea what the issue could be and how to solve it?
Edit: What Id should have done was create a new variable to store the subscription (or assign to an existing variable).
Then I can unsubscribe that variable when needed.
Thanks For detail video on this
Please create a video for back-end setup....love you ❤
Bro, this vedio was really helpful for me. can you please upload vedio for microsoft login using angular
Wow! amazing! You saved me hours of trying to figure that out. Can you make a video on how to do it using Firebase to keep the session & use a Firebase database?
Thanks for this video. Loved the explanation. Can you help me understand why we didn't need to use the client secret, which was displayed at time 4:07 in the video?
good explanation bro
please make the video. so much helpful
How do you do authorization?
In my case, I can only get access token and each time I do, I have to sign in for some reason, despite already being signed in.
Thank you so much ankit, can I also use this in the app development using angular and capacitorJS?
Great work, thank you
I believe when i was looking into this the angular social login was not working right in Angular 14, Google is also deprecating some older APIs and using a new library for auth and idk if Angular social login is as up to date, im not sure but i saw your video on the topic, and wanted to chime in
This package works fine with the latest google update as well. I created this video after google had depricated the older api.
Error : 'asl-google-signin-button' is not a known element
Have you imported it in you Module file?
@@FixItWithAnkit yesss
@@FixItWithAnkit Please help
@@FixItWithAnkit yes . asl-google-signin-button' is getting error
i have the same error, i use angular 15
I'm using angular18 and in this folder structure I don't have any modules, so where should I import providers
Thanks!! very usefull. I have a question : How can we make the authentication window open directly in our page rather than in a separate window?
Why didn’t you get token_auth field and response field along with scopes?
Great tutorial thanks a lot, but the music! Please turn it down.🙂
I´m trying to implement this library with Angular 15, but I´m facing error with some methods called in a .mjs file, have you faced this? :(
I have used angular version 16 but i am unable to see the google icon.
Hi Sir. asl-google-signin-button is not visible . Wat could be the issue?
Check the console for errors.
Thanks for your response. There's no errors in the console . I inspected the button and saw that it is present in the dom. I wonder why it's not visible in the UI
Am using angular 11 application will it work??
For me its not working brother, Not even opening the google sign in page , im using Angular 17, Its working now. Thanks
Please make a video on google signin with node/express
what to do for angular version 9?
tumhare source se client_id change krne ke baad The given origin is not allowed for the given client ID. ka error aa rha h kyu bro
You have to add origin of your app. If you are running on localhost then it will be localhost:port or if you have a domain, add your domain as origin while configuring the app.
it works on angular 13 and 14
hey , bro im getting error and blank page after build my project in angular ? how to solve this one and in ng serve is working fine
Are you using ssl while on production?
Thanks
'asl-google-signin-button' is not a known element. this is the error i get, i dont find a fix and i have SocialLoginModule imported in app module. help please
I facing same issue!
hi brother...it works fine in localhost...but when it come to the live server..it is not working..when i click the button, it just displays white box without any login informations...and in the console it says "m=credential_button_library:44 [GSI_LOGGER]: The given origin is not allowed for the given client ID."..help me to solve it
You have to add the production url of your application to the google app along with localhost:4200
@@FixItWithAnkit where i add because bydefault its open in 4200 localhost
Anyone found a way of preventing automatic sign in popup window from coming up on every page refresh?
I found it in the provider configured in your app.module below your id key add
provider: new GoogleLoginProvider(
environment.googleAuthLoginKey,
{
oneTapEnabled: false,
}
)
HI, I am using angula 16 and it's giving me error -
src/app/app.component.html:3:1 - error NG8001: 'asl-google-signin-button' is not a known element:
1. If 'asl-google-signin-button' is an Angular component, then verify that it is part of this module.
You must have forgotten to add it to your app.module
@@FixItWithAnkit I am still facing the same issue,
My Google Console project is GoogleAuthAngularTest,
so should I add
,
but still I am getting error and I have done all things in app.module.ts
pls help me, 'asl-google-signin-button' is not a known element:
May need to import a module for this.
It helps my project, it only reaches the part where the button appears, but when I press it, it does not show the Google accounts:(((
Did you add a proper google app id?
how about signup ?
Once you receive the details send the token to the backend and it will fetch the google account details using the token and create a user in you database.
Angular 15 Error:
asl-google-signin-button' is not a known element
If 'asl-google-signin-button' is an Angular component, then verify that it is part of this module.
Add the module in you app.module.ts . I think you missed that step
@@FixItWithAnkit Thanks for your quick reply,
Everything was there, we need to import GoogleSigninButtonModule where we are using above directive/component
@@alhaq-v-quran Thank you so much
@@alhaq-v-quran but what path should i mention ??
background music is distracting
Thanks for the feedback
hi thanks for the video
this works only angular 14, verified, thanks