CODEWITHSUNDEEP
azureaxioscorscreate-react-appazure-api-management
Jordyn
Jordyn

Reputation: 113

CORS - Enabled localhost origin on Azure API Management, but still receiving error

I'm trying to test retrieving data from my teams API that is configured via Azure API Management. I'm local hosting the client web app (a create-react-app project) that will be making calls to the API, and enabled CORS policies for my localhost origin in APIM. I've added the inbound policies for All Operations in APIM: enter image description here

I call the api using the same headers and method that's enabled in the CORS policy.

enter image description here

Yet I still get hit with the "No 'Access-Control-Allow-Origin' header is present on the requested resource." I don't want a use a plugin since that doesn't really solve the large problem, and I can't use a wildcard because 'Allow-Credentials' must be set to true. I've looked at so many versions of this question and nothing has helped. Does anyone know what I might be missing?

Upvotes: 2

Views: 4135

Answers (1)

Jordyn
Jordyn

Reputation: 113

Restating derpirscher's answer for others: I needed to add Options to the allowed method because a preflight Options request is sent:

<cors allow-credentials="true">
        <allowed-origins>
            <origin>http://localhost:3000</origin>
        </allowed-origins>
        <allowed-methods>
            <method>GET</method>
        </allowed-methods>
        <allowed-headers>
            <header>content-type</header>
            <header>accept</header>
            <header>authorization</header>
            <header>options</header>
        </allowed-headers>
</cors>

Upvotes: 4

Related Questions