Naar de hoofdinhoud

Configuratie van uw CSP met Axeptio

Geschreven door Alexandre Dias Da Silva

Beleidsregels voor Content Security

De Beleidsregels voor Content Security (CSP) worden als header naar de browser van uw gebruikers verzonden door uw webserver. Ze worden gebruikt om aan te geven welke dynamische bronnen op uw pagina mogen worden geladen.

Voor veel websites betekent dit vaak het aangeven dat alleen scripts en stijlen van uw eigen domein en die van alle tools die u gebruikt, zijn toegestaan. Dit kan echter problematischer worden wanneer complexere configuraties in het spel zijn.

Als u CSP-fouten op uw site identificeert die vergelijkbaar zijn met de onderstaande, moet uw ontwikkelingsteam of hostingprovider uw CSP-instellingen aanpassen.

Uw CSP-instellingen aanpassen

1. Controleer of er CSP-fouten zijn.

Als u problemen hebt met statistieken en toestemmingen in de Axeptio-backend, kan dit soms worden veroorzaakt door een CSP-fout. U kunt deze fouten controleren in de ontwikkelaarsconsole van uw browser. U kunt leren hoe u de console opent door de stappen in deze gids te volgen.

Als er een probleem is met het Content Security Policy, ziet u een fout die lijkt op die hieronder:

Capture d'écran 2023-12-13 à 19.12.18.png

2. Neem contact op met uw webontwikkelaar of hostingprovider om de CSP-instellingen aan te passen.

Omdat alle servers verschillend zijn, zal het Axeptio-ondersteuningsteam niet in staat zijn om deze problemen verder op te lossen dan het identificeren van een CSP-fout. Bij het wijzigen van uw Content Security Policies is de beste persoon om contact mee op te nemen uw webontwikkelaar of degene die uw website beheert.

3. Kies welke CSP-instellingen u wilt aanpassen.

Als u een standaard CSP gebruikt, is het toevoegen van het volgende aan uw default-src regels voldoende.

De "..." in de onderstaande voorbeelden zijn tijdelijke aanduidingen voor alle bestaande regels die u mogelijk van kracht hebt:

default-src ... https://.axept.io https://.axeptio.eu https://axeptio.imgix.net https://*.gstatic.com 'unsafe-inline'

Als u strengere beperkingen wilt, raden wij het onderstaande model aan om ervoor te zorgen dat uw beleidsregels meer bestand zijn tegen toekomstige veranderingen terwijl we onze services uitbreiden. Hier is een voorbeeld van hoe dit eruit zou kunnen zien:

default-src … 'unsafe-inline' 
script-src … https://*.axept.io 'unsafe-inline'
connect-src … https://*.axept.io https://*.axeptio.eu https://*.axeptio.tech
img-src … https://axeptio.imgix.net https://*.axept.io https://*.gstatic.com
media-src … https://axeptio-videos.imgix.net
font-src … https://fonts.axept.io

Als uw CSP meer granulariteit vereist, volgen hier de absolute minimale beveiligingstoestemmingen die u aan uw webserver moet toevoegen om Axeptio correct op uw site te laten functioneren:

script-src … https://static.axept.io 'unsafe-inline' 
connect-src … https://*.axept.io https://*.axeptio.eu https://*.axeptio.tech
img-src … https://axeptio.imgix.net https://favicons.axept.io https://*.gstatic.com
media-src … https://axeptio-video.imgix.net
font-src … https://fonts.axept.io

Gebruik van een nonce

Om uw website tegen onverwachte code-uitvoering te beschermen, kunt u vertrouwen op het Nonce attribuut om de uitvoering van scripts alleen tot geautoriseerde uit te beperken. Dit helpt voorkomen dat schadelijke code wordt uitgevoerd. De integratie van de Axeptio-widget ondersteunt het Nonce attribuut en kan eenvoudig worden geconfigureerd met behulp van de integratiescode.

  1. Configureer uw nonce-ID in de HTTP-header van de pagina's op uw website en hergebruik dit als attribuut voor elk script dat op de pagina wordt uitgevoerd.

<?php     
$nonce = base64_encode(random_bytes(18));
header("Content-Security-Policy: default-src 'self'; script-src 'strict-dynamic' 'nonce-" . $nonce . "' https:");
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
<head>
<title>CSP Nonce</title>
<script type="text/javascript" nonce="<?= $nonce ?>" src="..."></script>
</head>
<body>
<script type="text/javascript" nonce="<?= $nonce ?>">
myFunction();
</script>
</body>
</html>

2. De Axeptio-widget is een script dat op uw website wordt geladen. U hoeft alleen het gegenereerde nonce attribuut aan het integratieScript toe te voegen en dit te associëren met een speciaal axeptioSettings attribuut, dat verantwoordelijk is voor het doorgeven van de nonce-waarde aan alle onderdelen die door de Axeptio-widget worden beheerd.

<!-- Integreer uw JS-script hier -->    
<script nonce=$nonce>
window.axeptioSettings = {
clientId: "axeptio-client-id",
cookiesVersion: "axeptio--cookie-version",
nonce: $nonce
};

(function(d, s) {
var t = d.getElementsByTagName(s)[0], e = d.createElement(s);
e.async = true;
e.src = "https://static.axept.io/sdk.js";
t.parentNode.insertBefore(e, t);
})(document, "script");
</script>

Nu wordt alle inline HTML-inhoud die door de Axeptio-widget wordt gegenereerd, gevalideerd via het nonce attribuut en triggert geen unsafe-inline fout meer.

Was dit een antwoord op uw vraag?