Question 119555 in Firebase Question posted in
An extensive official documentation can be found here.

Firebase – Firestore: Fetch API cannot load… due to access control checks

Getting this error on mobile safari:

Fetch API cannot load https://firestore.googleapis.com/google.firestore.v1.Firestore/Write/channel?gsessionid=&database=&RID=&AID&TYPE=xmlhttp&zx=&t=1 due to access control checks.

(I stripped out some of the param values)

The app is working though, and the domain is whitelisted in the firestore settings. But I want to resolve this error anyway.

It’s not a security rules issue, because those throw specific errors. I opened all the documents anyway to check, but this error persisted:

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
      // This does not fix the issue
      allow read, write: if true;
    }
  }
}

Search results for this error generally refer to cors issues, but doesn’t make sense for this case. Any ideas appreciated…

"firebase": "^9.10.0"

Tags:

3

Answers


  1. 0

    if I’m not mistaken, firestore can’t be used if the user isn’t logged in, maybe you should add a login user before doing anything in firestore.
    and in firestore rules add this. [CMIIW]

    rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
     allow read, write: if request.auth != null;
    }
  }
    Login or Signup to reply.
  2. 0

    The error mentioned seems to be due to CORS issues .You should also check if the header Access-Control-Allow-Origin is set on both the server side and client side.
    Also as stated here try to compare the actual requests made by Safari to the successful requests done to spot possible missing Headers as well (and maybe compare them to your server configuration as well).
    This kind of implementation was previously achieved using XMLHttpRequest. As “Fetch” provides a better alternative that can be easily used by other technologies such as Service Workers. Fetch also provides a single logical place to define other HTTP-related concepts such as CORS and extensions to HTTP.
    A core security principle of the web is: loading resources from other domains is disallowed by default, unless the server specifically allows it. The error messages also could appear because you are trying to fetch something from a different domain, and the server is not set up to specifically allow it.
    Read up on Cross-Origin Resource Sharing (CORS) to learn more. Usually it comes down to adding the HTTP header Access-Control-Allow-Origin: * on the response.

    See similar example here:

    Login or Signup to reply.
  3. 0

    We’ve been faced with the same issue and even thought to leave it as is but then our architect found similar issue with solution – https://github.com/firebase/firebase-js-sdk/issues/4527#issuecomment-786749028

    The main idea is that firebase instance has to be deleted before page is reloaded or redirected. In github link there is a recipe for pure javaScript.

    firebase.app().delete()

    We had this issue in React and most probably it is related to Firestore onSnapshot method usage which is listening to database collection changes.

    Just in case anyone will have same error in React this code will help to solve it:

    useEffect(() => {
    const unloadCallback = () => {firebase.app().delete()}
    window.addEventListener("beforeunload", unloadCallback);
    return async () => {
      window.removeEventListener("beforeunload", unloadCallback);
    }
  }, [])
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search