Enable the Content Security Policy (CSP)

This page describes how to enable Content Security Police (CSP) so your application is compatible with Browser RUM.

Directives Required for CSP

To enable CSP for instrumented applications, you add the following required directives in the Content-Security-Policy header:

```
script-src
```
```
connect-src
```

In certain cases, you are also required to use the following directives:

```
child-src
```
```
frame-ancestors
```
```
img-src
```

script-src

The script-src directive specifies the location of adrum-ext.js. By default, adrum-ext.js is loaded from our content delivery network (CDN) at cdn.appdynamics.com. The example below shows how you might use the script-src directive.

script-src cdn.appdynamics.com;

CODE

To measure first-byte time accurately, include the following line at the top of pages:

window["adrum-start-time"] = new Date().getTime();

JS

For this line to be read, you also need to set the script-src directive to 'unsafe-inline' as shown here:

script-src 'unsafe-inline';

CODE

Skip unsafe-inline if you require to add nonce to the CSP, see Add Nonce to adrum-ext.js.

connect-src

The connect-src directive specifies the location where beacons are sent. If you are using the SaaS-based EUM, you might use something like the following:

connect-src col.eum-appdynamics.com;

CODE

If you are using on-prem EUM, you would have connect-src point to your EUM Server.

child-src

For cross-domain sessions, we load adrum-xd.html into an iframe. By default, this is loaded from our CDN, so you need to have child-src specify a CDN as shown below.

child-src cdn.appdynamics.com;

CODE

frame-ancestors

If adrum-xd.html is hosted locally, you would use the frame-ancestors directives in the following way:

frame-ancestors /path/to/adrum-xd.html;

CODE

img-src

In older browsers, we send our beacons as image beacons. Although older browsers don't support CSP, you can configure the JavaScript Agent to always send image beacons. You do this using img-src directive to specify the beacon location as shown in the example below.

img-src col.eum-appdynamics.com;

CODE

Example Content-Security-Policy Header

The following Content-Security-Policy header loads the adrum files from our CDN and then sends beacons to our SaaS-based EUM.

Content-Security-Policy: connect-src 'self' col.eum-appdynamics.com; script-src 'unsafe-inline' cdn.appdynamics.com; img-src cdn.appdynamics.com; child-src cdn.appdynamics.com

CODE