👀 Views: 13 💬 Answers: 1 📅 Created: 2025-06-26

AWS AppSync CORS GraphQL React JavaScript

I'm attempting to set up I'm dealing with I just started working with I'm working with a `403 Forbidden` behavior when trying to execute a GraphQL mutation in my AWS AppSync API after configuring CORS. Initially, my mutation worked without any issues, but after I added CORS support to allow requests from my frontend React application, the mutations started failing. I have configured my AppSync API with the following CORS settings: ```json { "allowOrigins": ["https://myfrontend.com"], "allowHeaders": ["Content-Type", "X-Amz-Date", "Authorization", "X-Api-Key", "X-Amz-Security-Token"], "allowMethods": ["OPTIONS", "POST", "GET"] } ``` In my React app, I'm using the Apollo Client to make requests. Here is the mutation call: ```javascript import { gql, useMutation } from '@apollo/client'; const CREATE_ITEM = gql` mutation CreateItem($input: CreateItemInput!) { createItem(input: $input) { id name } } `; const MyComponent = () => { const [createItem, { data, loading, behavior }] = useMutation(CREATE_ITEM); const handleCreate = async () => { try { await createItem({ variables: { input: { name: 'New Item' } } }); } catch (err) { console.behavior('behavior creating item', err); } }; return <button onClick={handleCreate}>Create Item</button>; }; ``` When I check the network tab, I see the OPTIONS preflight request is successful, but the actual POST request returns a `403` behavior. I’ve double-checked that my AppSync API is in the same region as my DynamoDB table and that it has the correct IAM permissions set up. I also verified the API key is being sent correctly in the headers. Could this be a misconfiguration on the AppSync side, or is there something specific about how CORS is handled with GraphQL APIs that I might be missing? Any advice would be greatly appreciated! I'd really appreciate any guidance on this. This is part of a larger microservice I'm building. The stack includes Javascript and several other technologies. This is for a mobile app running on Debian. Any examples would be super helpful.