Requêtes pour fichiers statiques

Contentsquare utilise deux méthodes complémentaires pour collecter les ressources statiques nécessaires au Session Replay et au Zoning : le Static Resource Scraper et le Static Resource Manager (SRM).

Le Scraper est le collecteur principal et toujours actif, mais nécessite une configuration pour accéder à vos ressources. SRM peut ensuite être configuré pour collecter les ressources auxquelles le Scraper ne peut pas accéder.

Le Scraper s’exécute automatiquement et télécharge de manière asynchrone les ressources accessibles publiquement (CSS, images, polices) depuis votre site web :

• S’exécute toutes les 6 heures pour les pages fréquemment consultées
• Effectue un scraping en temps réel lorsque les ressources ne sont pas en cache
• Nécessite l’ajout des adresses IP à la liste d’autorisation ou la configuration d’un header personnalisé
• Stocke les ressources de manière sécurisée pendant 13 mois

Limitations :

• Les éléments doivent être accessibles depuis les adresses IP de Contentsquare.
• Les éléments derrière une authentification ou un VPN ne sont pas accessibles.
• Les ressources qui changent fréquemment (URLs avec cache-busting) peuvent devenir obsolètes.

Pour les ressources auxquelles le scraper ne peut pas accéder, SRM est la méthode de collecte alternative.

Quand SRM est nécessaire :

• Ressources derrière une authentification ou une page de connexion
• Ressources protégées par VPN ou réseau privé
• Éléments nécessitant des cookies ou headers spécifiques à l’utilisateur
• Contenu généré dynamiquement ou dépendant du contexte utilisateur
• URLs de données encodées en base64

Comment fonctionne SRM :

• Le navigateur de l’utilisateur télécharge la ressource pendant la session utilisateur
• Le tag calcule un hash unique et vérifie si Contentsquare possède déjà cette ressource
• Si elle est nouvelle, le tag l’envoie directement aux serveurs Contentsquare
• Les ressources sont dédupliquées entre les sessions grâce à l’identification par hash

Pour activer le Scraper, autorisez Contentsquare à accéder à vos éléments en utilisant l’une des options suivantes :

• Autoriser les adresses IP (recommandé)
• Utiliser un header statique personnalisé (alternative)

Le Scraper a besoin d’une autorisation explicite pour accéder à votre site web via votre proxy, firewall ou configuration serveur. L’ajout à la liste d’autorisation des adresses IP est la méthode recommandée car elle est plus simple à mettre en œuvre et à maintenir.

Pourquoi c’est nécessaire : Votre firewall ou vos systèmes de sécurité peuvent bloquer les requêtes automatisées. En ajoutant les adresses IP de Contentsquare à votre liste d’autorisation, vous permettez à notre Scraper de télécharger les ressources statiques sans déclencher d’alertes de sécurité ou de limitation de débit.

Ouvrez les ports 80 (HTTP) et 443 (HTTPS) et autorisez les adresses IP suivantes afin d’empêcher que le scraper soit bloqué par votre proxy, firewall ou configuration serveur.

52.18.162.157
20.75.90.236
100.24.76.90
34.192.98.148
20.67.250.109
54.247.44.196
52.51.9.12
35.72.153.38
35.73.99.41
34.192.240.128

Si vous ne pouvez pas autoriser par IP, vous pouvez utiliser une approche basée sur un header personnalisé.

Avantage sécurité : Cette méthode vous permet de vérifier que les requêtes proviennent légitimement de Contentsquare en validant la valeur du header personnalisé.

Quand utiliser cette méthode :

• L’ajout à la liste d’autorisation des IP est restreint par votre politique de sécurité
• Vous avez besoin d’un contrôle plus précis sur l’accès du scraper
• Vous souhaitez surveiller et journaliser les requêtes du scraper séparément

Avec cette option, Contentsquare ajoute un header personnalisé aux paramètres du projet.

{
  "headers": {
    "my-new-header-key": "myKeyValue"
  }
}

Vous pouvez ensuite valider que les requêtes du scraper contiennent le header et la valeur spécifiques.

receivedHeaderExample = "myKeyValue";

const CONTENTSQUARE_CUSTOM_HEADER = "myKeyValue";
if (receivedHeaderExample === CONTENTSQUARE_CUSTOM_HEADER) {
  //
}

Pour vérifier que le scraping fonctionne correctement :

1. Vérifiez que vos Session Replays s’affichent avec le bon style et les bonnes images
2. Consultez les logs serveur pour les requêtes réussies depuis les IP Contentsquare

Contactez le support si les replays affichent des ressources manquantes après la configuration.

Le Static Resource Manager est une méthode complémentaire où le tag Contentsquare collecte les ressources directement depuis le navigateur du visiteur et les envoie aux serveurs Contentsquare.

SRM gère deux types de ressources :

• URLs de données (images base64) : Collectées automatiquement — aucune implémentation requise
• Ressources distantes : Doivent être explicitement activées pour chaque pageview via une commande tag

Utilisé pour :

• Les éléments derrière une authentification ou un VPN
• Les éléments nécessitant des cookies ou données de session spécifiques
• Le contenu généré dynamiquement ou spécifique à l’utilisateur

Limitations :

• Politiques de cache manquantes ou restrictives : Si les ressources n’ont pas d’en-tête Cache-Control autorisant la mise en cache par le navigateur, SRM effectue des requêtes supplémentaires vers le serveur de ressources pour chaque session. Cela se produit également lorsque les ressources retournent des erreurs 404 (par exemple, lorsque la page référence des éléments que le serveur ne trouve pas).
• Restrictions CORS : Les ressources avec des politiques Cross-Origin Resource Sharing (CORS) incompatibles ne peuvent pas être récupérées par le navigateur, empêchant SRM de les collecter.
• Chargement différé (lazy loading) non respecté : SRM télécharge toutes les ressources dès qu’il les découvre dans le DOM ou le CSS, indépendamment de l’implémentation du chargement différé. Cela peut compromettre votre stratégie de lazy loading et provoquer le chargement immédiat de toutes les ressources. Si votre site repose sur le chargement différé pour les performances, évitez d’activer la collecte des ressources en ligne avec SRM.

Lorsque SRM est activé pour votre projet, le tag Contentsquare collecte automatiquement les URLs de données encodées en base64 trouvées dans le DOM. Cela garantit que les images intégrées s’affichent correctement dans Session Replay.

Aucune implémentation supplémentaire n’est requise pour les URLs de données.

Pour les ressources distantes qui sont derrière une authentification ou non accessibles au Scraper, vous devez explicitement activer la collecte des éléments en ligne pour chaque pageview via une commande tag.

Exécutez la commande suivante avant le début du pageview :

window._uxa.push(["replay:resourceManager:enableForOnlineResource:nextPageviewOnly"]);

Exemple avec trackPageview :

// Activer SRM pour le prochain pageview
window._uxa.push(["replay:resourceManager:enableForOnlineResource:nextPageviewOnly"]);

// Puis tracker le pageview
window._uxa.push(["trackPageview", location.pathname + location.search + location.hash]);

Pour vérifier l’état actuel du Static Resource Manager, utilisez la commande suivante :

window._uxa.push(["replay:resourceManager:getStatus"]);

Cette commande retourne :

{
    isStarted: true,
    onlineAssets: {
        activated: false,
        enabledOnNextPageview: false,
        enabledForChildrenOnNextStart: false
    }
}

Si les ressources n’apparaissent pas dans les Replays, vérifiez ces problèmes courants :

1. IP non autorisée : Vérifiez que toutes les IP Contentsquare sont autorisées sur les ports 80 et 443
2. Authentification requise : Les ressources derrière une connexion ne peuvent pas être scrapées automatiquement
   • Solution : Envisagez d’utiliser SRM pour les ressources authentifiées (contactez le support)
3. VPN ou réseau privé : Les ressources sur les réseaux internes ne sont pas accessibles
   • Solution : Utilisez SRM pour les ressources internes (contactez le support)
4. Restrictions géographiques : Les ressources avec blocage géographique peuvent ne pas être accessibles
   • Solution : Configurez les paramètres de proxy spécifiques à la région (contactez le support)
5. Limitation de débit : Votre serveur peut limiter les requêtes du scraper
   • Solution : Ajoutez nos IP à votre liste d’autorisation dans votre configuration de limitation de débit