Skip to main content
Documentation & User Guides | Fotoware

CSP, CORS, and User Interface integrations

Note: This information applies to Fotoware On-Premises only. 

Cross-site scripting protection mechanisms in browsers are made to protect users against malicious code when embedding content and scripts from external sources (as in external domain names). As most integrations will be hosted on a separate domain, such mechanisms often take effect.

Note: We do not recommend installing browser plugins to overcome these restrictions.

CSP in Fotoware

CSP (Content Security Policy) is a security mechanism to control sources from which external content can be loaded into an HTML page. Typically, it should be configured so that content can only be loaded from specific trusted sources, ideally only from the same domain as the page.  FotoWeb also has strict CSP rules which only allow embedding of content from the same domain and specific additional domains.

When registering a user interface integration with Fotoware, the domain part of the URL to the integration is automatically added to Fotoware's CSP rules. 

The integration might not work if it redirects to pages hosted on other domains.

User Interface Integrations - CSP rule.png

If a third-party website used in a UII redirects to a different domain, then the destination domain may be blocked by CSP. As a remedy, use the final URL in the UII configuration, so it is allowed by CSP.

Integrators should not assume that CSP is active on a user's browser and rely on CSP alone to secure UIIs. Always carefully construct URL patterns for UIIs to secure the integration against possible XSS attacks via metadata values.

 

CSP in Integration

Note that a website may also prevent other applications (such as FotoWeb) from embedding it.

  • When building a bespoke integration that is to be embedded as a UII, make sure that the frame-ancestors CSP directive of the integration does not prevent such embedding by either not using this directive, setting it to * to allow embedding in all domains, or setting it to explicitly allow embedding into FotoWeb (requires that the domain of the FotoWeb site is known).
  • When embedding a third-party website as a UII, be aware that it may have a content-security policy that prevents embedding in FotoWeb or altogether. Google Maps and YouTube are known examples of websites that prevent embedding of the main websites (but do support embedding via special embedding URIs). For more information, consult the documentation of any external websites or web applications you would like to embed.
    Embedding third-party websites may require paid subscriptions, and some third-party websites may display ads or track users (this has privacy implications). Even if a third-party website does not prevent embedding via CSP, this can change at any time and without warning, so your UII may stop functioning at any time.

Note: CSP rules in FotoWeb have a long cache time, meaning newly registered UIIs may not work for some time. Deleting the browser caches does not help in this instance.

CORS in Fotoware

Fotoware does currently not append CORS (Cross-origin Resource Sharing) headers. This means that any API calls from the integrations must be performed from the server side and not the client side in the integration.

A UII is usually loaded from a different origin domain than the FotoWeb site. Therefore, it is not possible to directly make API requests to FotoWeb from JavaScript code due to the browser's same-origin policy. To make API requests from a UII, the following options exist:

  1. Make API requests from a back-end: If the UII is supported by a back-end server on the origin domain it is loaded from, then it can make direct requests to this back-end, which can, in turn, make API requests to FotoWeb.
  2. Enable CORS: By enabling cross-origin resource sharing on the FotoWeb site, the origin domain of the UII can be allowed to make API requests directly to FotoWeb form JavaScript code.