Embedded View Blocked by Content Security Policy (CSP)

An application’s Content Security Policy (CSP) can prevent an external view, such as one from TM, from being embedded in an e.g. <iframe>.

Symptom

When attempting to embed a TM view, the <iframe> may appear empty or show a browser error. The browser’s developer console will show a Content-Security-Policy error indicating that framing the external URL is not allowed.

Cause

The Content-Security-Policy HTTP response header is a security measure that controls which resources a browser is permitted to load. The frame-src directive within this policy restricts the origins that can be embedded in frames. If the TM view’s origin is not listed in the frame-src directive, the browser will block it.

Solution

To resolve this issue, you must update your application’s Content-Security-Policy HTTP header. Add the origin of the TM service to the frame-src directive. This change allows the browser to frame and display content from the specified TM origin.