Content Security Policy (CSP)

The default Web Component bundle includes both styles and the Web Worker in a single file. To support this setup, the worker is executed from a Blob. This requires your CSP to allow the blob: source:

Content-Security-Policy: script-src 'self'; worker-src 'self' blob:

However, bundling everything into a single file may not be compatible with strict CSP configurations. For strict CSP compliance, use the modular assets provided in the /dist_external directory, or import the external build manually.

form.js

import "altcha/external";
import "altcha/altcha.css";

altcha_worker.js

import "altcha/worker";

With this approach, the following components are included separately:

• altcha/external – The Web Component without injected CSS or Web Worker.
• altcha/worker – The Web Worker.
• altcha/altcha.css – CSS for the widget.

This modular setup allows ALTCHA to function properly without requiring blob: in your CSP, making it suitable for applications with strict security requirements.

For a complete example and setup guide, see the altcha-starter-csp repository.