{"id":155,"hash":"c27069dd06452c6499e9601a63d11aafedc655c148b5ea5e2b5be6e007acd722","pattern":"Cross-Origin-Opener-Policy policy would block the window.closed call error while using google auth","full_message":"I am using firebase and its google auth tool , everything works fine the user data is getting saved in the database but i get a error every time the popup  window appears (Cross-Origin-Opener-Policy policy would block the window.closed call)\n\ni am using next js and do help me resolve the error thank you","ecosystem":"npm","package_name":"firebase","package_version":null,"solution":"This error appears in the firebaseui npm package.\n\nThe first important thing to understand is that sign-in problem might not be related to the displayed console error:\n\nsignInFlow=\"redirect\"\nThe easiest way to check that your code is working without the error is to switch temporarily from signInFlow=\"popup\" to signInFlow=\"redirect\", which is the default value in Firebase UI Auth.\n\nIf Auth does not work\nCheck the code on:\n\nMissed JS Context, for example, <AuthProvider/> in React.\n\nSubscribe to firebase/auth events and check that the user object is returned (React example):\n\nimport { getAuth, onAuthStateChanged } from 'firebase/auth';\n\nconst StyledFirebaseAuth = () => {   \n  useEffect(() => {\n\n  const unregisterAuthObserver = onAuthStateChanged(\n   getAuth(),\n   async (user) => {\n     console.log('user', user);\n   },\n );\n\n// the rest of code\n}\n\nCheck Firebase Sign-in method settings to allow specific providers\n\nCheck Firebase Authentication allowed domains\n\nCheck your Firebase configuration for the web application:\n\n const firebaseConfig = {\n   apiKey: \"ABCDEF...\",\n   authDomain: \"your-project-domain\",\n   projectId: \"you-project\",\n   appId: \"1:abcdef...\"\n };\n\nTrying get rid of the console error\nChrome blog suggests  to use Cross-Origin-Opener-Policy: restrict-properties with Cross-Origin-Embedder-Policy: require-corp. Sadly, it will not work with Firebase UI.\n\nThe problem is with Cross-Origin-Embedder-Policy header, which is by default should be set to unsafe-none.\n\nThis header should be returned with the html page or omitted (the implicit default value). It is possible to set it up manually.\n\nPlease notice that to correctly test it, a server should be restarted and browser cache cleared or a new incognito window used.\n\nLocal development:\nBelow are React examples but similarly should work other frameworks.\n\nFor create-react-app and craco modify craco.config.js as:\n module.exports = {\n   devServer: {\n     headers: {\n       'Cross-Origin-Embedder-Policy': 'unsafe-none'\n     }\n   }\n }\n\nFor Next.js modify next.config.js:\n module.exports = {\n   async headers() {\n     return [\n       {\n         source: \"/login\",\n         headers: [\n           {\n             key: \"Cross-Origin-Embedder-Policy\",\n             value: \"unsafe-none\",\n           },\n         ],\n       },\n     ];\n   },\n };\n\nFirebase hosting\nFirebase allows to specify headers that are passed for the hosted files, including .html, .js. Modify firebase.json file, for example, for a Single Page Application (SPA):\n\n{\n  \"hosting\": [\n    {\n      \"target\": \"web\",\n      \"public\": \"web/build\",\n      \"ignore\": [\"firebase.json\", \"**/.*\", \"**/node_modules/**\"],\n      \"rewrites\": [\n        {\n          \"source\": \"**\",\n          \"destination\": \"/index.html\"\n        }\n      ],\n      \"headers\": [\n        {\n          \"source\": \"**/*\",\n          \"headers\": [\n            {\n              \"key\": \"Cross-Origin-Embedder-Policy\",\n              \"value\": \"unsafe-none\"\n            }\n          ]\n        }\n      ]\n    }\n  ]\n}\n\nAlthough after my attempts to change Cross-Origin-Opener-Policy, Cross-Origin-Resource-Policy and Cross-Origin-Embedder-Policy to different values still the error log appears in the Chrome browser but the sign-in method is working.\n\nFor more strict security settings and the unsafe-none value please refer to the documentation.","confidence":0.95,"source":"stackoverflow","source_url":"https://stackoverflow.com/questions/76446840/cross-origin-opener-policy-policy-would-block-the-window-closed-call-error-while","votes":88,"created_at":"2026-04-19T04:41:25.073177+00:00","updated_at":"2026-04-19T04:51:06.844666+00:00"}