Configuring Cross-Origin Resource Sharing (CORS) headers

HCL Commerce supports Cross-Origin Resource Sharing (CORS). The HttpSecurityFilter servlet filter supports the configuration of CORS-related headers included in the HTTP response. You can configure the filter by extending the component configuration file (wc-component.xml).

About this task

The HttpSecurityFilter servlet supports the CORS response headers defined in the CORS specification:
  • Access-Control-Allow-Origin
  • Access-Control-Allow-Credentials
  • Access-Control-Expose-Headers
  • Access-Control-Max-Age
  • Access-Control-Allow-Methods
  • Access-Control-Allow-Headers
This topic describes how to configure these headers by creating and modifying a custom configuration file.
Note: HCL Commerce CORS support includes the ability to whitelist multiple domains. Any configuration changes you make to CORS-related headers will apply to all whitelisted domains.

Procedure

  1. Create a custom foundation component configuration file (wc-component.xml), if one does not exist.
    For more information about how to create a custom configuration file, see Changing properties in the component configuration file.
    Note:
    • The default component configuration file for the foundation component is WCDE_installdir/workspace/WC/xml/config/com.ibm.commerce.foundation/wc-component.xml
    • The custom component configuration file for the foundation component should be WCDE_installdir/workspace/WC/xml/config/com.ibm.commerce.foundation-ext/wc-component.xml

      To change the value of an existing property in an HCL Commerce component configuration file, you must create a customized version of the file in this location. The customized version of the file must contain only the changed properties. If this folder exists and contains a customized version of the wc-component.xml file, then open the file and skip to step 2.

  2. Configure CORS response headers by adding the corresponding properties to your extended wc-component.xml file.
    The following properties are available for you to define:
    (Required) CORSAccessControlAllowOrigin
    List of allowed host domains. Use comma-separated values (protocol://host_name:[port]), where the port number is optional. The CORSAccessControlAllowOrigin property can accept a single value of wildcard (*) to permit access for any origin.
    Note: Do not use wildcards (*) in production environments.
    CORSAccessControlAllowMethods
    The HTTP methods allowed for access (comma-separated values). Returned in the response to a preflight request.
    CORSAccessControlAllowCredentials
    Whether the browser is allowed to send credentials to the server (true | false). Default is false.
    CORSAccessControlAllowHeaders
    The HTTP headers of allowed request headers (comma-separated values). Returned in response to a preflight request.
    CORSAccessControlExposeHeaders
    The HTTP headers that can be accessed by a browser (comma-separated values).
    CORSAccessControlMaxAge
    The time (in seconds) the results of preflight request will be cached in a preflight results cache.
    The configuration is applied on a per web module basis. The target web module is determined by appending the display name of the web module's web.xml file to the configgrouping name. For example, by naming one configgroupping "HttpSecuritySettings_Rest" and another configgrouping "HttpSecuritySettings_Store", different values can be configured for the REST servlet and the Store servlet, respectively.
    Example:
    <_config:configgrouping name="HttpSecuritySettings_Rest">
	<_config:property name="CORSAccessControlAllowOrigin" value="http://www.mydomain.com,https://www.mydomain.com,https://www.mydomain.com:9551"/>
	<_config:property name="CORSAccessControlAllowMethods" value="GET, HEAD, POST, OPTIONS, PUT, DELETE"/>
	<_config:property name="CORSAccessControlAllowCredentials" value="true"/>
	<_config:property name="CORSAccessControlAllowHeaders" value="Origin,X-Requested-With,Content-Type,Accept,Authorization,cache-control,expires,pragma,wclogonid,wctoken,wctrustedtoken,wcuserid"/>
	<_config:property name="CORSAccessControlMaxAge" value="3600"/>
</_config:configgrouping>
  3. Save and close the extended configuration file.
  4. Test your configuration changes.

What to do next

For more information about cross-origin resource sharing (CORS), see Cross-Origin Resource Sharing or the HTML5 tutorial Using CORS.

For more information about X-Frame-Options header, see Mozilla Developer Network (MDN) documentation.