Back

CORS localhost -> graphql endpoint

  • 0
  • GraphQL
  • Web
  • Cloud
Criffis
13 Apr, 2024, 20:47

I'm trying to add a accountCreate mutation from my local environment to my cloud project.

I keep getting the following error.

TypeScript
Access to XMLHttpRequest at 'https://cloud.appwrite.io/v1/graphql/mutation' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Project hostname is set to localhost

My NextJs middleware follows NextJS CORS middleware template: https://nextjs.org/docs/app/building-your-application/routing/middleware#cors

with

TypeScript
const allowedOrigins = ["https://cloud.appwrite.io", "http://localhost:3000"]

export const config = {
  matcher: "/:path*",
}

This should be working... Any ideas why it doesn't?

I am logging the Project ID in the client setup in the code, and it matches the one in the cloud.

TL;DR
Developers are facing a CORS issue when trying to connect their NextJS app running on localhost to a cloud project. They have set up the allowed origins correctly but are still getting an error. Double-check the platform setup in the Appwrite console and ensure the Project hostname is set to 'localhost' to avoid CORS issues.
Kenny
13 Apr, 2024, 20:54

have you added a platform for localhost in the appwrite console?

Criffis
13 Apr, 2024, 20:55

Yes I did!

Reply

Reply to this thread by joining our Discord

Reply on Discord

Need support?

Join our Discord

Get community support by joining our Discord server.

Join Discord

Get premium support

Join Appwrite Pro and get email support from our team.

Learn more