Error "popup_closed_by_user"

[dukeace2005]

Getting 'popup closed by user' error after choosing Google account and clicking 'Allow' in popup screen. Here is my request: <GoogleLogin clientId='.....apps.googleusercontent.com' buttonText="Login" scope='https://www.googleapis.com/auth/drive.file' onSuccess={this.responseGoogle} onFailure={this.responseErrorGoogle}/>

[Kinertia]

+1 for this issue. Everything appears to work, but not getting anything in the response and seeing this error in the console.

[mathurs]

This is likely because your google + api is not enabled. Go to Library and search for plus api. There should be a result for google plus API, please enable it and try again.

[alexghi]

Any news on this?

[dougneves]

I was experiencing the same problem here. It was resolved when I re-created google credentials.

Go to https://console.developers.google.com/apis, and in the Google Plus API, access credentials, and create a new credential for "Oauth Client Id". In the "Application Type" select "Web Application". Be sure to put the full address of where the API is being called in the "Authorized redirect URIs". Finally, use the new "Client ID" that will be generated.

Despite this, the message displayed ("popup_closed_by_user") is not correct, so I believe the issue should be kept open.

[tirli]

Also getting this error. And seems like it's random and based on loading status. Because sometimes when I wait enough, I'm not getting an error. What is more, after I added this button, sometimes I'm getting infinite loading after reload (and in this state, the button always returns popup closed by user)

[glorp47]

+1 this issue just started occurring for me...

[g33ktony]

Also happening to me

[m1m1s1ku]

Same for me

[braco]

Try clearing your browser cache

[tirli]

Clearing cache can help for a while, though the main problem is that error description doesn't explain what happened. And it's what should be fixed.

[dylankilkenny]

Having the same issue. It works normally in chrome, but getting { error: "popup_closed_by_user" } in firefox

[xoapit]

Clear browser cache and open new tab. It works for me.

[grugna]

I have the same issue in chrome only. It works in Firefox and Safari

[prodislav]

its help me: https://github.com/anthonyjgrove/react-google-login/issues/132#issuecomment-364713349

[Drnutsu]

how about this issues ?

[khalidahmada]

Clear cache and refresh will work. It work for me.

[Sunny-Lau]

Got this error on local, fixed it by including port number in the 'Authorized JavaScript origins', which is http://localhost:8000 instead of http://localhost

[subash-poudel]

I fixed this issue by whitelisting

http://localhost

and adding cookiePolicy

<GoogleLogin clientId={WEB_CLIENT_ID} buttonText="Login with LF account" onSuccess={this.responseGoogle} onFailure={this.responseGoogle} cookiePolicy={'single_host_origin'} />

https://developers.google.com/identity/sign-in/web/reference#googleauththenoninit-onerror

[danmo]

2019, the issue is still present. Hit me out of nowhere.

[benjaminadk]

Clearing the cache worked for me as well.

[thiagonache]

for me, every time you have this error is because something is miss-configured, google or code.

[vemarav]

worked after clearing browser cache and cookies

[retzion]

I have a website deployed that serves a number of domains. All my .com domains on this hosted site work fine but my .dev site simply will not work unless I use an incognito browser. I can even open a new computer and visit the site for the very first time and I get an error. (All browsers) Response from the iframe request : {"valid":false} Does anyone have any insight as to why?

[junlee91]

Response from the iframe request : {"valid":false} Does anyone have any insight as to why?

@retzion Configure your Authorized JS origin & redirect URI as mentioned in https://stackoverflow.com/a/53510968/8254487

[Curti-s]

Just cleared 1.3gb of cookies and cache but still no gain. Each time I try to sign up I get invalid client, right after setting http://localhost:3000 in google credentials

[narthur]

Clearing the cache doesn't strike me as a good solution if you're trying to make sure your users aren't hit with this error.

This solution worked for me: https://github.com/anthonyjgrove/react-google-login/issues/132#issuecomment-458029717

[ahmedrafayat]

This is how I got it to work in Chrome, Go to Setting -> Advanced -> Clear browsing data -> Cached images and files -> Clear Data Also try this, going to site settings and make sure you allow 'Popups and redirects'

[karel947]

09/2019 Still facing this issue, quite sad...

[Edward101701]

My colleagues on Mac and Windows face this problem as well. But on Mac more frequently

[ap0ca]

Check your browser plugins... Disable some which could potentially block trackers. In my case it was Privacy Badger

[koynu14]

any updates regarding on the issue?

[JoshuaVSherman]

no because you need the hash string as well to decode the jwt token, and your server-side code using the GoogleClientSecret

here is my working example: https://github.com/WebJamApps/web-jam-back/blob/dev/auth/google.js

On Fri, Jul 17, 2020 at 8:42 AM AminRafaey notifications@github.com wrote:

Hello everyone, Using OAuth 2.0 Client ID directly in the client-side will not expose our credentials? Anyone can go into the console of browser and after getting this id can use it for getting data from google on our behalf

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/anthonyjgrove/react-google-login/issues/132#issuecomment-660085330, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADFY3WB3F7WPXVAYIUVL3LLR4BBKLANCNFSM4EGE3MKQ .

-- Josh Sherman https://web-jam.com https://www.linkedin.com/in/joshuavsherman/ 540-494-8035

[alozytskyi]

Check your browser plugins... Disable some which could potentially block trackers. In my case it was Privacy Badger

Thanks! Unlocking google domains in privacy badger has helped me.

[cambo2015]

I fixed the issue in my chromium-browser. I tried to clear my cache, but no change. The issue for me seemed to be that third parties cookies are not allowed. I am using localhost:3000/8000, client/server. chromium>settings>privacy& security>allow all cookies. I don't like this solution all that much though.

EDIT: ah, I found this in the documentation: https://www.npmjs.com/package/react-google-login#onfailure-callback

• initialization of the Google Auth API failed (this will occur if a client doesn't have third party cookies enabled)

[rahuls360]

In my case, I was using incognito mode in Chrome and was facing this error. Turns out, that this issue is because cookies are not enabled in incognito mode/guest mode. This could be a possible workaround - https://stackoverflow.com/questions/63631849/google-sign-in-not-working-in-incognito-mode , I haven't tried it out yet though

[nhidangsd]

02/21: I just bumped into this issue on Chrome. Clearing the Cached images and files did fix the issue.

[peterkapena]

So having this issue opened in 2021 means this is still outstanding. Of course clearing cache solves the problem but this cannot be the ultimate solution telling your users to clear cache all the time they have to use the site.

Will we ever get this fixed?

[harsh-vish14]

This same is there with me I have just stop blocking cookies at the top right there is an eye just click on that allow all cookies

This solved my issue

[luchillo17]

I'm running this in an ElectronJS app, can't find any docs about how to enable 3rd party cookies, so had to force a reload when this specific error shows and hope it was actually logged correctly, anyone knows how to fix this in Electron?

[wecoon]

It seems that I was getting this error when I allowed site in Facebook container. This is Firefox feature to block Facebook tracking, and it also blocks login via Facebook.

I was implementing Facebook login too, so I had to allow it, but it brake Google login.. somehow.

[JanSeulin]

I was having this problem on Firefox only. Of all solutions listed here the only one that worked was mentioned by ap0ca. Turns out in my case it was the "Google Container" extension, after disabling it, it's working again. If nothing else mentioned works I would advise to try disabling all extensions like adblocks, tracker blockers, etc

[bmmathe]

I was experiencing the same problem here. It was resolved when I re-created google credentials.

Go to https://console.developers.google.com/apis, and in the Google Plus API, access credentials, and create a new credential for "Oauth Client Id". In the "Application Type" select "Web Application". Be sure to put the full address of where the API is being called in the "Authorized redirect URIs". Finally, use the new "Client ID" that will be generated.

Despite this, the message displayed ("popup_closed_by_user") is not correct, so I believe the issue should be kept open.

This worked for me but when I re-created the client credential I didn't add a web server Authorized Redirect URI. I'm not sure if this matters.

[henrymcl]

I encountered this issue after upgrading helmetjs from 4.6.0 to 5.0.0. When I tried removing the helmet middleware (or downgrading), the issue was gone. Here's the config I supplied to helmet which had worked in 4.6.0 but not 5.0.0

{
  contentSecurityPolicy: {
    directives:{ 
      ...helmet.contentSecurityPolicy.getDefaultDirectives(),
      'script-src': ["'self'", "https://apis.google.com/"],
      'frame-src': ["'self'", "https://accounts.google.com/"]
    }
  }
}

There are some breaking changes, namely:

• Breaking: helmet.contentSecurityPolicy: useDefaults option now defaults to true
• Breaking: helmet.contentSecurityPolicy: form-action directive is now set to 'self' by default
• Breaking: helmet.crossOriginEmbedderPolicy is enabled by default
• Breaking: helmet.crossOriginOpenerPolicy is enabled by default
• Breaking: helmet.crossOriginResourcePolicy is enabled by default
• Breaking: helmet.originAgentCluster is enabled by default

While the version update is on 2022-01-03 and is very unlikely to be the root cause to your issue, these policies can be a good starting point to look at. (I'm still learning about those policies and can't give a definitive answer)

UPDATE The culprit is apparently cross-origin-opener-policy. Helmet uses the strictest same-origin while same-origin-allow-popups resolves the "popup_closed_by_user" issue in my case. More helpful error messages would indeed help.

[nadeemkhan02]

clearing the cache didn't work for me!

[nadeemkhan02]

Clearing the cache doesn't strike me as a good solution if you're trying to make sure your users aren't hit with this error.

This solution worked for me: #132 (comment)

can you please explain the solution?

[LuisJoseLopezD]

cache thing, does not work!!!

[kasvith]

Im having the same issue

[Infinitay]

I'm having the same issue when deploying my React app to GitHub Pages.

EDIT: After a few hours it ended up working. I'm not sure if its because I put every single denomination of the redirect uri on Google's credential page or if its because it really did take a few hours to update like the page said.

[kasvith]

For anyone who is struggling with this, try to use the following library

https://www.npmjs.com/package/@react-oauth/google

Google requires new OAuth clients to use the latest library, otherwise old library does not properly initialize, hence leads to this error.

I solved this simply by using the library mentioned above

[AlekseiKromski]

For anyone who is struggling with this, try to use the following library

https://www.npmjs.com/package/@react-oauth/google

Google requires new OAuth clients to use the latest library, otherwise old library does not properly initialize, hence leads to this error.

I solved this simply by using the library mentioned above

Thank you, bcs i try to work with a lot of vue3 libraries for google sigin button and anyone not working 😠. Who will read it, try to create by Google api your custom solution or wait, were someone create working library