CORS policy error #5592

ghost · 2021-10-08T15:28:48Z

ghost
Oct 8, 2021

Hello,

I apologize if this question is very good (I am very new to JavaScript and Firebase). I have been trying to set up Firebase by following this tutorial: Getting started with Firebase for the web -- Firebase Fundamentals. So far, it has been helpful, but when I run index.html, I get the following error:

I am not sure how to solve this error, but it seems like the CORS policy is blocking my access to the firebase libraries.

In case this helps, here is my index.js code:

import { initializeApp } from "https://www.gstatic.com/firebasejs/8.10.0/firebase-app.js";
import { getAuth, onAuthStateChanged } from "https://www.gstatic.com/firebasejs/8.10.0/firebase-auth.js";
import { getFirestore } from 'https://www.gstatic.com/firebasejs/8.10.0/firebase-firestore.js';

// Your web app's Firebase configuration

// For Firebase JS SDK v7.20.0 and later, measurementId is optional

const firebaseApp = initializeApp({

    apiKey: "apiKey information",

    authDomain: "authDomain information",

    databaseURL: "databaseURL information",

    projectId: "projectId information",

    storageBucket: "storageBucket information",

    messagingSenderId: "messagingSenderId information",

    appId: "appId information",

    measurementId: "measurementId information"

});

const auth = getAuth(firebaseApp);
const db = getFirestore(firebaseApp);

// Detect auth state
onAuthStateChanged(auth, user => {
    if (user != null) {
        console.log('logged in!');
    }
    else {
        console.log('No user');
    }
})

And my index.html code:

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="module" src="index.js"> </script>
</head>
<body>

</body>
</html>

Answered by hsubox76

Oct 8, 2021

The "x-ijt" header that is interfering with the request seems to be something Webstorm adds: https://youtrack.jetbrains.com/issue/WEB-30191 and not related to Firebase. I'd suggest asking in Webstorm forums or Stack Overflow, or anywhere else you can find help from Webstorm users.

View full answer

hsubox76 · 2021-10-08T18:38:35Z

hsubox76
Oct 8, 2021
Maintainer

The "x-ijt" header that is interfering with the request seems to be something Webstorm adds: https://youtrack.jetbrains.com/issue/WEB-30191 and not related to Firebase. I'd suggest asking in Webstorm forums or Stack Overflow, or anywhere else you can find help from Webstorm users.

0 replies

ghost · 2021-10-09T17:00:19Z

ghost
Oct 9, 2021

@hsubox76 Hi Christina, thank you for your suggestion and for pointing me in the right direction!

I actually think that I may have found the solution to my problem and nearly burst into tears out of relief. I was looking up if someone received a similar error using Webstorm, and I found a post that helped me solve this error: CORS errors from Font Awesome font in Angular app.

It seems that going into settings and clicking "Allow unsigned requests" will help. Thank you again, and I hope you have a wonderful week!

Michelle

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

CORS policy error #5592

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Replies: 2 comments

{{title}}

{{title}}

Select a reply

CORS policy error #5592

ghost Oct 8, 2021

Replies: 2 comments

hsubox76 Oct 8, 2021 Maintainer

ghost Oct 9, 2021

ghost
Oct 8, 2021

hsubox76
Oct 8, 2021
Maintainer

ghost
Oct 9, 2021