Helpers for creating Content Security Policy (CSP) headers.
- Zero dependencies
- Build with TypeScript
- Merging multiple CSP configurations
- Providing preset CSP configurations for:
- Datadog
- Google Ads
- Google Analytics 4
- Google Identity
- Google Tag Manager
- Hotjar
- TikTok
- Vimeo
- X
- Youtube
- ... and more
npm install csp-helperCreate a CSP header string from a CSP configuration object.
import {
CSP_PRESET_DATADOG_INTAKE_URLS,
CSP_PRESET_DATADOG_WEB_WORKER,
CSP_PRESET_GOOGLE_ANALYTICS_4,
CSP_PRESET_GOOGLE_TAG_MANAGER_UNSAFE_INLINE,
CSP_PRESET_HOTJAR,
createCspHeader,
} from 'csp-helper';
const cspHeader = createCspHeader(
{
'default-src': `'self'`,
'script-src': `'self' https://example.com`,
'style-src': `'self' https://example.com`,
},
{
includeHeaderName: true,
presets: [
CSP_PRESET_DATADOG_INTAKE_URLS,
CSP_PRESET_DATADOG_WEB_WORKER,
CSP_PRESET_GOOGLE_ANALYTICS_4,
CSP_PRESET_GOOGLE_TAG_MANAGER_UNSAFE_INLINE,
CSP_PRESET_HOTJAR,
],
},
);
console.log(cspHeader);Merge multiple CSP configurations into one.
- Same values will be automatically deduplicated.
- Presets could also be used for merging.
import {
CSP_PRESET_GOOGLE_ANALYTICS_4,
CSP_PRESET_GOOGLE_TAG_MANAGER_UNSAFE_INLINE,
mergeCspConfigs,
} from 'csp-helper';
const cspConfig = mergeCspConfigs([
{
'default-src': `'self'`,
'script-src': `'self' https://example.com`,
'style-src': `'self' https://example.com`,
},
{
'script-src': `'self' https://example.com https://example2.com`,
'style-src': `'self' https://example.com https://example2.com`,
},
CSP_PRESET_GOOGLE_ANALYTICS_4,
CSP_PRESET_GOOGLE_TAG_MANAGER_UNSAFE_INLINE,
]);
console.log(cspConfig);MIT © meteorlxy & Contributors