@Anant Welcome to Microsoft Q&A Forum, Thank you for posting your query here!
I see that you are facing a CORS error when trying to access an API from the frontend. The error message indicates that The Same Origin Policy disallows reading the remote resource (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). Status code: 200
. The customer has already configured the CORS policy in Azure API Management, but the error persists.
Plan 1: Please add a CORS policy at the All Operations scope for your API that looks like following:
<cors allow-credentials="false">
<allowed-origins>
<origin>*</origin>
</allowed-origins>
<allowed-methods preflight-result-max-age="300">
<method>*</method>
</allowed-methods>
<allowed-headers>
<header>*</header>
</allowed-headers>
<expose-headers>
<header>*</header>
</expose-headers>
</cors>
<base />
You shouldn't remove <base/>
call as it will prevent calls to forward-request and request will never be forwarded to backend. You should ensure that this CORS policy is the very first policy in the <inbound> section at the "All Operations" scope for this API. The <base/>
call should be AFTER the CORS policy. see below:
Plan 2: Check the API response headers to ensure that the 'Access-Control-Allow-Origin' header is included. You can use a tool like Fiddler or the browser developer tools (F12) to inspect the API response headers. And then confirm if the 'Access-Control-Allow-Origin' header is included in the response.
Please let me know if you have any further questions or concerns. I would be happy to help.
** Please do not forget to "Accept the answer” and “up-vote” wherever the information provided helps you, this can be beneficial to other community members.