I’m developing a Shopify app and facing a CORS error when trying to send a request from the storefront to my server.
Error:
Access to fetch at 'https://multimedia-arg-such-transcript.trycloudflare.com/api/assistant?query=Hello' from origin 'https://getvoicecart.myshopify.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'.
Storefront Request Code:
fetch(`https://multimedia-arg-such-transcript.trycloudflare.com/api/assistant?query=${encodeURIComponent(query)}`, {
method: 'GET',
credentials: "include",
})
CORS Headers in api.assistant Response:
return json(
{ response: processedResponse },
{
headers: {
"Set-Cookie": `threadID=${threadID}; Path=/; HttpOnly; Max-Age=86400;`,
"Access-Control-Allow-Origin": "https://getvoicecart.myshopify.com/",
"Access-Control-Allow-Credentials": "true",
"Access-Control-Allow-Methods": "GET, POST, OPTIONS",
"Access-Control-Allow-Headers": "Content-Type, Authorization, _shopify_y",
},
}
);
Question:
Why am I still facing this CORS error, and how can I fix it? Is there something specific to Shopify or Cloudflare that could cause this issue?
Any help or guidance would be greatly appreciated!
Steps I’ve Tried:
- Ensured that “Access-Control-Allow-Origin” is set to my Shopify domain (https://getvoicecart.myshopify.com).
- Added “Access-Control-Allow-Credentials”: “true” to allow cookies and credentials.
- Checked the request URL, method, and credentials in the fetch call.
- Confirmed that the Cloudflare server is reachable.