Proxying the Ketch Preference Center

The Ketch Smart Tag has the ability to pull identity information store within cookies and local storage on a users browser, but when running a privacy portal on a subdomain, the Ketch Smart Tag loses the ability to access local storage.

To combat this limitation, we have developed a plugin for the Ketch Smart Tag to facilitate the identity gathering process across the domains.

Prerequisites

Requirements
Due to browser security restrictions, the below requirements are needed for the proxy to work:

  • Content Security Policy must be set correctly for both the proxy and host domains
  • The X-Frame-Options header must not be served on the host page
  • The proxy page will be loaded into a sandboxed iframe, requiring only the following sandbox properties: allow-scripts allow-same-origin

Ketch Property update

In the Ketch Platform,

  • Navigate to Experience Server -> Properties.
  • Select the property and click Edit.
  • In the corresponding environment, select proxy and enter the url for the proxy page
  • Click Save.

Proxy page

The proxy page will facilitate access to local storage of the host domain.
The minimum requirements on this page are:

  • The trusted-origin meta property must set to the origin that is allowed to communicate with the "host" domain.
  • The Ketch proxy-host JavaScript file is loaded on the page.

Example:
Note: the URL's are examples and should be changed to reflect your organizations pages

<!DOCTYPE html>
<html>
   <head>
      <title>Host</title>
      <meta name="trusted-origin" content="https://privacy.example.com" />
   </head>
   <body>
      <script src="https://cdn.ketchjs.com/plugins/static/proxy-host.js"></script>
   </body>
</html>

Privacy portal page

In order to gain access to host domain local storage, a hidden iframe will need to be added to the privacy portal page with its src attribute set to the url of the proxy page. The Ketch Smart Tag will recognize when it is on a different domain and automatically add the hidden iFrame.

Content Security Policy

The Content-Security-Policy of each serving domain must be set with the following minimum settings:

Serving domainContent-Security-Policy
Host domainscript-src https://cdn.ketchjs.com
Proxy domainframe-src https://host.example.com script-src https://cdn.ketchjs.com