CORS Error when I use Parameter Reference in KVM

[praviningawale]

I was using below KVM policy in the shared flow. When consumer was calling the proxy it was working fine.

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<KeyValueMapOperations name="XYZ" mapIdentifier="XYZ">
    <Scope>environment</Scope>
    <Get assignTo="private.ClientId">
        <Key>
            <Parameter>ClientId</Parameter>
        </Key>
    </Get>
    <Scope>environment</Scope>
</KeyValueMapOperations>

Then I changed the KVM policy to as below, the consumer started getting CORS error.

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<KeyValueMapOperations mapIdentifier="ABC" async="false" continueOnError="false" enabled="true" name="GetKVM">
    <DisplayName>GetKVM</DisplayName>
    <ExpiryTimeInSecs>864000</ExpiryTimeInSecs>
    <Scope>environment</Scope>
    <Get assignTo="ClientId" index="1">
        <Key>
            <Parameter ref="request.header.x-api-key"/>
        </Key>
    </Get>   
</KeyValueMapOperations>

I already have CORS policy added in the target preflow as below

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<AssignMessage name="add-cors" async="false" continueOnError="false" enabled="true">
    <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,  content-type, authorization, x-api-key</Header>
            <Header name="Access-Control-Max-Age">3628800</Header>
            <Header name="Access-Control-Allow-Methods">GET, PUT, POST, DELETE</Header>
        </Headers>
    </Set>
    <IgnoreUnresolvedVariables>true</IgnoreUnresolvedVariables>
    <AssignTo type="response" createNew="false" transport="http"/>
</AssignMessage>

I an using Verify access token and hence using below condition too.

<Step>
<Name>FC-VerifyAccessToken</Name>
<Condition>request.verb != "OPTIONS"</Condition>
</Step>

There error started occurring only after the KVM policy change when I added

<Parameter ref="request.header.x-api-key"/>

[dchiesa1]

error started occurring only after the KVM policy change when I added...

I think that's not true. The error observed by the client (browser) would happen when the client started sending that header. It seems likely that the error is caused by CORS enforcement by the browser... That is to say, the browser request tried to send a header that is prohibited by CORS enforcement, so the browser refused to send it.&

it is coincidental that you changed the KVM policy to reference that header.

I understand that you have a CORS policy in the target preflow. That is probably not the right place to put it. There is a documentation page that discusses this. See here. Unfortunately in Apigee today, it's a little laborious to catch all the exit points from a proxy and insure the CORS headers are correctly transmitted. You cannot simply attach something in a preflow (and not in the target preflow anyway). You've got to handle the preflight request, you've got to handle faults.

The good news is the product team has addressed this issue in Apigee X, with a new CORS policy that makes it much simpler. This is coming in the next few weeks, I'd guess. Documentation is pending. (Watch this space for an announcement and a screencast demonstration)

But if you are using Apigee Edge, ... then you have to do it the "manual way" as described in that documentation link I referenced.

CORS problems can be tricky to solve because the browser caches the CORS responses, and so even after you change your proxy to allow the x-api-key header, the browser can still refuse to send it. In that case you may need to open a new incognito window or use a different browser in order to avoid the caching pitfalls, just for the duration of the cache. This problem goes away if you wait long enough. (minutes? not sure).