# Implementing Content Security Policy (CSP) for Beacon Integration

Content Security Policy (CSP) is a critical security feature that helps protect your web application from common vulnerabilities such as Cross-Site Scripting (XSS) attacks. To ensure the proper functionality of Beacon, our third-party JavaScript, while safeguarding your users, it is essential to include the minimal set of CSP rules listed below in your web application's security configuration:

```
script-src: https://*.beacon.li;
```

This rule allows the execution of JavaScript code from the domain `https://*.beacon.li`. It ensures that Beacon's JavaScript files can be loaded and executed safely within your web application.

```
frame-src: https://*.beacon.li;
```

This rule specifies the domains from which your web application can embed frames. By allowing `https://*.beacon.li`, you enable Beacon to load content securely in iframes within your app.

```
img-src: https://*.beacon.li;
```

This rule defines the sources from which images can be loaded. Allowing `https://*.beacon.li` ensures that images used by Beacon can be displayed without security restrictions.

```
media-src: https://*.beacon.li;
```

Media sources, such as audio or video, are controlled by this rule. Allowing `https://*.beacon.li` permits Beacon to load media content safely.

```
connect-src: https://*.beacon.li;
```

This rule manages the sources that your application can establish network connections with. Allowing `https://*.beacon.li` ensures that Beacon can communicate securely with its servers.

```
style-src: https://*.beacon.li;
```

Stylesheets and style sources are controlled by this rule. Allowing `https://*.beacon.li` permits Beacon to apply styles as needed for its functionality.

#### Implementation

To implement these CSP rules, you need to add them to your web application's security policy. Depending on your platform and server configuration, this can be done in various ways, such as:

* Adding CSP headers in your web server configuration.
* Including CSP meta tags in your HTML documents.
* Specifying CSP rules in the `Content-Security-Policy` HTTP header.

Here's an example of how you can include CSP headers in your web server configuration (e.g., in Apache):

```apache
Header always set Content-Security-Policy "script-src https://*.beacon.li; frame-src https://*.beacon.li; img-src https://*.beacon.li; media-src https://*.beacon.li; connect-src https://*.beacon.li; style-src https://*.beacon.li;"
```

Please adapt the implementation to your specific server and application setup.

By implementing these CSP rules, you can ensure the proper functionality of Beacon while enhancing the security of your web application, protecting your users against potential XSS vulnerabilities.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://api.beacon.li/implementing-content-security-policy-csp-for-beacon-integration.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.