Content Security Policy (CSP)

If your site uses CSP, you need to allow the Besökskollen script.

What is CSP?

Content Security Policy is a security feature that restricts which scripts can run on your site. If you see errors like "Refused to load the script" in the browser console, it's likely due to CSP.

CORB vs CSP

It's important to distinguish between CSP (Content Security Policy) and CORB (Cross-Origin Read Blocking):

CSP error

Message: Refused to load the script

Solution: Add besokskollen.se to your CSP (see below)

CORB error

Message: blocked by CORB

Solution: This is a different issue - contact us

Tip: CORB is the browser's protection against cross-origin responses and requires correct CORS headers from our server. If you see this error, contact us and we'll help you.

Update your CSP

Add besokskollen.se to your script-src directive:

Content-Security-Policy: script-src 'self' https://besokskollen.se;

Full example

Here's an example of a CSP header that allows Besökskollen:

Content-Security-Policy: default-src 'self'; script-src 'self' https://besokskollen.se; script-src-elem 'self' https://besokskollen.se; connect-src 'self' https://besokskollen.se;

Required directives

Directive	Value	Purpose
script-src	https://besokskollen.se	Allows loading the script
script-src-elem	https://besokskollen.se	Allows external script tags
connect-src	https://besokskollen.se	Allows API calls (tracking data)

Important about priority

CSP headers can be set in multiple places. Which one "wins" depends on your server configuration:

Source	Priority
Nginx/Apache config	Highest
.htaccess	High
PHP header()	Lower
<meta>-tag	Lowest

Tip: If the script is still blocked even though you added the domain in PHP, check if CSP is set via .htaccess - it can override PHP headers.

Meta tag alternative

If you can't change HTTP headers, you can use a meta tag in <head>:

<meta http-equiv="Content-Security-Policy"
  content="default-src 'self'; script-src 'self' https://besokskollen.se; script-src-elem 'self' https://besokskollen.se; connect-src 'self' https://besokskollen.se;">

Next.js

In Next.js, you can configure CSP in next.config.js:

// next.config.js
const securityHeaders = [
  {
    key: 'Content-Security-Policy',
    value: "default-src 'self'; script-src 'self' https://besokskollen.se; script-src-elem 'self' https://besokskollen.se; connect-src 'self' https://besokskollen.se;"
  }
];

module.exports = {
  async headers() {
    return [
      {
        source: '/:path*',
        headers: securityHeaders,
      },
    ];
  },
};

Vercel

On Vercel, you can add headers in vercel.json:

{
  "headers": [
    {
      "source": "/(.*)",
      "headers": [
        {
          "key": "Content-Security-Policy",
          "value": "default-src 'self'; script-src 'self' https://besokskollen.se; script-src-elem 'self' https://besokskollen.se; connect-src 'self' https://besokskollen.se;"
        }
      ]
    }
  ]
}

Next.js on Vercel (recommended)

Recommendation: If you're running Next.js on Vercel, use vercel.json instead of next.config.js to ensure headers are always sent correctly.

Here's a complete example combining the tracking script with CSP headers in vercel.json:

{
  "headers": [
    {
      "source": "/(.*)",
      "headers": [
        {
          "key": "Content-Security-Policy",
          "value": "default-src 'self'; script-src 'self' https://besokskollen.se; script-src-elem 'self' https://besokskollen.se; connect-src 'self' https://besokskollen.se;"
        }
      ]
    }
  ]
}

Then add the tracking script in your app/layout.tsx:

// app/layout.tsx
import Script from 'next/script'

export default function RootLayout({ children }) {
  return (
    <html lang="sv">
      <head>
        <Script
          defer
          data-site-id="DIN-SAJT-ID"
          data-api="https://besokskollen.se"
          src="https://besokskollen.se/script.js"
          strategy="afterInteractive"
        />
      </head>
      <body>{children}</body>
    </html>
  )
}

Apache / .htaccess

If you set CSP via .htaccess (common on Apache servers), it will override any PHP headers.

Add https://besokskollen.se to your .htaccess:

<IfModule mod_headers.c>
    Header set Content-Security-Policy "\
default-src 'self'; \
script-src 'self' https://besokskollen.se; \
script-src-elem 'self' https://besokskollen.se; \
connect-src 'self' https://besokskollen.se;"
</IfModule>

Note: If you have CSP in both PHP and .htaccess, remove the CSP header from PHP (it's ignored anyway) and update .htaccess instead.

Troubleshooting

Here's how to find which CSP header is actually being sent:

Open DevTools (F12) → Network
Reload the page
Click on the HTML document (first request)
Under Response Headers, look for Content-Security-Policy
Verify that besokskollen.se is in script-src, script-src-elem and connect-src

Console vs Issues panel

CSP errors can appear in different places in DevTools:

Console tab

Shows direct errors when the script is blocked. Look for red messages starting with Refused to

Issues panel

Shows detailed CSP warnings with specific information about which directives are blocking. Open via F12 → More tools → Issues

Verify headers are being sent

If you've added CSP but it still isn't working, verify the header is actually being sent:

Open DevTools (F12) → Network
Check Disable cache (important!)
Reload the page (Ctrl+Shift+R)
Click on the HTML document and look for Content-Security-Policy under Response Headers
If the header is missing: Check your server configuration
If the header exists but besokskollen.se is missing: Update the CSP value

Common errors

script-src-elem missing - Add this directive in addition to script-src
PHP changes don't help - Check if .htaccess is overriding headers
Wrong domain - Make sure it says exactly https://besokskollen.se

← Back to integration guides