Script Flowsery Analytics bloque par la politique de securite du contenu (CSP)
Si vous avez ajoute le snippet de suivi Flowsery Analytics mais qu'aucune page vue n'apparait, les en-tetes Content Security Policy (CSP) de votre site empechent probablement son chargement.
Diagnostiquer un probleme CSP
- Ouvrez votre site dans Chrome ou Firefox
- Lancez les DevTools (F12 ou Cmd+Shift+I)
- Passez a l'onglet Console
- Recherchez une erreur similaire a :
Refused to load the script 'https://cdn.flowsery.com/main.js' because it violates the following Content Security Policy directive: "script-src 'self'"
Voir ce message confirme que les regles CSP empechent l'execution du script Flowsery Analytics.
Comprendre la Content Security Policy
Un CSP est un en-tete HTTP qui indique aux navigateurs quelles ressources externes (scripts, feuilles de style, images, etc.) sont autorisees a se charger sur une page. Lorsque analytics.flowsery.com n'est pas inclus dans la politique, le navigateur bloque silencieusement le script -- ce qui signifie qu'aucune donnee n'est collectee.
Resoudre le probleme
Ajoutez analytics.flowsery.com a la directive script-src dans votre en-tete CSP. Les etapes specifiques varient selon la plateforme.
Next.js
Mettez a jour l'en-tete Content-Security-Policy dans votre next.config.js :
const ContentSecurityPolicy = `
script-src 'self' 'unsafe-inline' 'unsafe-eval' https://cdn.flowsery.com;
`;
module.exports = {
async headers() {
return [
{
source: '/(.*)',
headers: [
{
key: 'Content-Security-Policy',
value: ContentSecurityPolicy.replace(/\n/g, ''),
},
],
},
];
},
};{
"headers": [
{
"source": "/(.*)",
"headers": [
{
"key": "Content-Security-Policy",
"value": "script-src 'self' 'unsafe-inline' https://analytics.flowsery.com;"
}
]
}
]
}/*
Content-Security-Policy: script-src 'self' 'unsafe-inline' https://cdn.flowsery.com;
Balise meta HTML
Lorsque vous ne pouvez pas modifier les en-tetes serveur, une balise meta dans le <head> est une alternative :
<head>
<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline' https://cdn.flowsery.com;" />
</head>Notez que cette approche ne prend effet que lorsqu'aucun en-tete CSP cote serveur n'est deja present -- les en-tetes serveur ont toujours priorite sur les balises meta.
Nginx
add_header Content-Security-Policy "script-src 'self' 'unsafe-inline' https://analytics.flowsery.com;" always;Header set Content-Security-Policy "script-src 'self' 'unsafe-inline' https://analytics.flowsery.com;"WordPress
Si vous utilisez un plugin de securite tel que WP Cerber, Sucuri ou Wordfence, accedez a ses parametres CSP ou "HTTP headers" et ajoutez https://analytics.flowsery.com a la liste des sources de scripts autorisees. Lorsque votre theme configure le CSP directement dans functions.php :
header("Content-Security-Policy: script-src 'self' 'unsafe-inline' https://analytics.flowsery.com;");Derriere un proxy ?
Si vous avez configure un proxy pour Flowsery Analytics, le script est servi depuis votre propre domaine. Dans ce scenario, 'self' dans votre CSP l'autorise deja, donc aucune modification supplementaire ne devrait etre necessaire. Si les problemes persistent apres la mise en place du proxy, verifiez que le endpoint du proxy se trouve sur le meme domaine que votre site web.
Utilisation de connect-src ?
Si votre CSP limite egalement connect-src (qui controle ou le navigateur peut envoyer des donnees via fetch/XHR), incluez analytics.flowsery.com dans cette directive egalement :
Content-Security-Policy: script-src 'self' https://analytics.flowsery.com; connect-src 'self' https://analytics.flowsery.com;
Problemes persistants ?
- Confirmez que vous modifiez l'en-tete CSP actif. Certains hebergeurs ou CDN peuvent remplacer les en-tetes.
- Recherchez plusieurs en-tetes CSP -- les navigateurs appliquent la combinaison la plus restrictive de tous les en-tetes presents.
- Videz le cache de votre navigateur et retestez dans une fenetre privee/incognito.
- Lorsque vous utilisez un proxy, assurez-vous que
script-srcetconnect-srcincluent votre domaine proxy.