Documentation

This is the new documentation of Custom Applications. You can still visit the legacy documentation during the migration from Project-level Custom Applications.

BETA

Merchant Center Proxy Router

When you navigate through the Merchant Center, you can switch between the different Custom Applications available in your Projects, no matter if they are commercetools applications or something developed externally.

You might have noticed that the URL of the Merchant Center is always using the same origin, and only the URI part changes depending on the Project and application.

https://mc.<cloud-region>.commercetools.com/:projectKey/dashboard
https://mc.<cloud-region>.commercetools.com/:projectKey/products
https://mc.<cloud-region>.commercetools.com/:projectKey/orders
https://mc.<cloud-region>.commercetools.com/:projectKey/avengers
...

This way it looks like you are using one single web application even though underneath there are multiple Custom Applications.

Routing

Every initial request to render the page goes through a server component called Merchant Center Proxy Router.
This server is primarily responsible for matching the incoming request to the appropriate Custom Application and to forward the request to the actual location of the Custom Application. The response then should be serving the index.html of the Custom Application.

For example, the user tries to access the /:projectKey/products URL. The request goes through the Proxy Router which successfully matches the products identifier. The Proxy Router then loads the related configuration for the Products application (assuming that the application is installed for the given projectKey) and forwards the request to the location where the Custom Application is hosted. The index.html is then returned as a response and the Proxy Router forwards that to the browser. The Products application renders.

The same principle applies to any Custom Application:

  1. Matching of the entryPointUriPath.
  2. Loading configuration of Custom Application based on the Project access.
  3. Forwarding of request to Custom Application URL.
  4. Serving of index.html.

Architecture Diagram
Merchant Center Proxy Router architecture

Security Headers

The Merchant Center Proxy Router enforces the following HTTP security headers when serving the response from the Custom Application location:

  • Strict-Transport-Security: 'max-age=31536000'
  • X-XSS-Protection: '1; mode=block'
  • X-Content-Type-Options: 'nosniff
  • X-Frame-Options: 'DENY'
  • Referrer-Policy: 'same-origin