Self Hosted

blocked by CORS policy: The 'Access-Control-Allow-Origin'

May 3, 2024, 15:00

View on Discord

Votes

Replies

Participants

Unknown

Messages

NlaakALDOriginal post

Rank 2: Process

May 3, 2024, 14:54

Ok, so i have been stuck on this all week now and just cannot figure it out.

Access to XMLHttpRequest at 'https://persist.nlaak.com/v1/databases/6632af383503c7338730/collections/6632b1546193ab0b3193/documents?queries%5B0%5D=%7B%22method%22%3A%22orderDesc%22%2C%22attribute%22%3A%22%24id%22%7D' from origin 'https://gwf.io' has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header has a value 'https://localhost' that is not equal to the supplied origin.
664-6bbf9cedbff601a5.js:1 
        
        
GET https://persist.nlaak.com/v1/databases/6632af383503c7338730/collections/6632b1546193ab0b3193/documents?queries%5B0%5D=%7B%22me

I have tried everything in stack overflow, digitalocean and the AppWrite YouTube video (Solving CORS errors with appwrite).

I am using multiple (web platforms localhost, prod domain). Even if i just make it wildcard (*) i still get the same error.

I cannot find "localhost" anywhere in the code or settings. Where is "'Access-Control-Allow-Origin' header has a value 'https://localhost'" coming from? im totally stumped!

Summary

Developers are encountering a CORS policy error related to the 'Access-Control-Allow-Origin' header. The issue lies in the mismatched origin value. To resolve, ensure the project ID is set correctly in the code or as a header in the request. Additionally, verify that 'localhost' is not inadvertently included in the settings or code.

Binyamin

Core

May 3, 2024, 14:56

How are you accessing the https://persist.nlaak.com/v1/databases/6632af383503c7338730/collections/6632b1546193ab0b3193/documents?queries%5B0%5D=%7B%22me URL.
Using fetch/xhr or Appwrite SDK?

Binyamin

Core

May 3, 2024, 14:59

You'll get a CORS error when Appwrite doesn't recognize the request.
In the SDK it won't happen when you're setting the project ID

If you're doing it manually make sure to add the project ID as header, for example

JavaScript

await fetch('YOUR URL', {
  headers: {
    'X-Appwrite-Project': '5df5acd0d48c2'
  }
})

blocked by CORS policy: The 'Access-Control-Allow-Origin'

Need support?_