I’m using dgraph-js-http in React to create Dgraph queries and mutations. My setup is basic and I’m following tutorials to create basic to-do lists.
The tutorials I followed are here:
In all three cases, Dgraph is running in Docker on localhost:8080 and React is running on localhost:3000. In all three cases I couldn’t create mutations through the React app because I got these errors in the Chrome developer tools:
Access to fetch at ‘http://localhost:8080/graphql’ from origin ‘http://localhost:3000’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled.
I think I’m missing something basic about Docker or networking. I researched CORS errors and it looks like the required header must be sent from the server, but as far as I can tell, I don’t have the ability to add those headers to the responses coming from the Dgraph side.
Can anyone see the problem with my setup?
edit: The interesting thing is that this tutorial https://dgraph.io/blog/post/building-todo-list-react-dgraph/ sets up Dgraph with docker-compose, and it does let me do mutations, but not modify the schema with
curl -X POST localhost:8080/admin/schema --data-binary '@schema.graphql'.
When the standalone docker version of Dgraph is used with the app from that tutorial, instead of the docker-compose version, I can modify the schema, but the above CORS errors come up.
But with this tutorial (the one with auth https://dgraph.io/docs/graphql/todo-app-tutorial/todo-overview/), CORS errors ensue regardless of whether docker-compose or the standalone Docker command is used.