Include Additional Headers in the API Console

The Swagger API Console is a JavaScript client that runs in the API Store and makes JavaScript calls from the Store to the API Gateway. Since the API Store and Gateway run on two different ports, we have enabled cross-origin resource sharing (CORS) between the two. You must specify any additional headers that you want to add to the API Console under the CORS configuration.

Open the CORS configuration in <APIM_HOME>/repository/conf/api-manager.xml file, enable CORS if it is not enabled already and specify the additional headers (Content-Type and SOAPAction, in this case) under the <Access-Control-Allow-Headers> element:

CORS configurations in api-manager.xml

 <CORSConfiguration>
    <Enabled>true</Enabled>
    <Access-Control-Allow-Origin>*</Access-Control-Allow-Origin>
    <Access-Control-Allow-Methods>GET,PUT,POST,DELETE,OPTIONS</Access-Control-Allow-Methods>
    <Access-Control-Allow-Headers>tenant, enterprise, authorization, Access-Control-Allow-Origin, Content-Type, SOAPAction</Access-Control-Allow-Headers>
</CORSConfiguration>

This configuration is only valid for APIs created through the API manager Publisher application. All the other Oauth token related APIs (/authorize, /revoke, /token, /userinfo) are not affected from this. To enable CORS configuration to these APIs as well, see "Enabling CORS for Oauth Token related APIs".

Next, let's see how to add the two headers as parameters to the API Console.

Enabling CORS for Oauth Token related APIs

Enabling CORS configuration through api-manager.xml is only valid for APIs created through the API manager Publisher application. Hence enabling CORS for Oauth token related APIs (/authorize, /revoke, /token, /userinfo) can be carried out as follows.

Based on the API that you need to enable CORS, add the following handler configuration to the relevant API synapse file present in <APIM_HOME>/repository/deployment/server/synapse-configs/default/api/ folder. It should be added within the <handlers> parent element.

<handler class="org.wso2.carbon.apimgt.gateway.handlers.security.CORSRequestHandler">
    <property name="apiImplementationType" value="ENDPOINT"/>
</handler>

The following are the mappings of the synapse files corresponding to the Oauth token related APIs.

Endpoint	Synapse configuration

Endpoint	Synapse configuration
/authorize	_AuthorizeAPI_.xml
/revoke	_RevokeAPI_.xml
/token	_TokenAPI_.xml
/userinfo	_UserInfoAPI_.xml