CORS error when testing from Dev portal

[shivakumarsudin]

Hi,

I am getting the below error when testing it from the developer portal

"has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status"

I am using the below CORS policy. Do I need to add any other header to resolve the above error?

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>

<AssignMessage async="false" continueOnError="false" enabled="true" name="add-cors"> <DisplayName>Add CORS</DisplayName>

<FaultRules/>

<Properties/>

<Set>

<Headers>

<Header name="Access-Control-Allow-Origin">*</Header>

<Header name="Access-Control-Allow-Headers">origin, x-requested-with, accept, Accept, Content-Type, apikey, Authorization, DUNS, Access-Control-Allow-Origin, User-Agent</Header>

<Header name="Access-Control-Max-Age">3628800</Header>

<Header name="Access-Control-Allow-Methods">GET, PUT, POST, DELETE, OPTIONS</Header> </Headers>

</Set>

<IgnoreUnresolvedVariables>true</IgnoreUnresolvedVariables>

<AssignTo createNew="false" transport="http" type="response"/> </AssignMessage>

Thanks and Regards

Shiv

[nagashree_b]

@Shivakumar Sudi

Can you post your trace for the request made from the dev portal.

Can you also check if your api proxy has the CORS configuration as outlined in the docs here.

[shivakumarsudin]

Hi,

Thanks, It works after I configured the CORS as per the docs. However, I have other proxies which are working fine without having to add this configuration(I have added the CORS headers alone but not the preflight flow condition and Route rule). This is bit strange as there seems to be no consistency.

Regards

Shiv

[vincdprime]

Hello @Shivakumar Sudi, I've also done the same thing. Also added CORS according to the docs but the error persists. Any idea why this happening?

[#5]

can you also try making

<Header name="Access-Control-Allow-Headers">*</Header>

[vincdprime]

Hello Priyadarshi, I did try that in one of the revisions but it's not working. The same error persists.

Basically what I'm doing taking 2 APIs, 1 for token generation and other for generating some records. When I hit the proxy in backend its working but giving cors error when doing it in swagger.

I enabled CORS, preflight etc according to the docs but error remains. If you could help that would be great as I'm new to Apigee

Thanks in abance

[#7]

refer: https://stackoverflow.com/questions/53298478/has-been-blocked-by-cors-policy-response-to-preflight-r...

[vincdprime]

Yes. you need to pass the cors header response in proxy flow. You can do this by adding the following code in proxy endpoint preflow:

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<ProxyEndpoint name="default">
    <Flows>
        <Flow name="OptionsPreFlight">
            <Request/>
            <Response>
                <Step>
                    <Name>add-cors</Name>
                </Step>
            </Response>
            <Condition>request.verb == "OPTIONS" AND request.header.origin != null AND request.header.Access-Control-Request-Method != null</Condition>
        </Flow>
    </Flows>
    <PreFlow name="PreFlow">
        <Request/>
        <Response>
            <Step>
                <Name>add-cors</Name>
            </Step>
		# This step will add cors header in your preflow request
        </Response>
    </PreFlow>
    <Flows/>
    <PostFlow name="PostFlow">
        <Request/>
        <Response/>
    </PostFlow>
    <HTTPProxyConnection>
        <BasePath>/test/recon-records</BasePath>
        <VirtualHost>secure</VirtualHost>
        <VirtualHost>default</VirtualHost>
    </HTTPProxyConnection>
    <RouteRule name="NoRoute">
        <Condition>request.verb == "OPTIONS" AND request.header.origin != null AND request.header.Access-Control-Request-Method != null</Condition>
    </RouteRule>
    <RouteRule name="default">
        <TargetEndpoint>default</TargetEndpoint>
    </RouteRule>
</ProxyEndpoint>