Implémentation de cookies internes pour résoudre les restrictions imposées par les navigateurs aux cookies tiers

Les préoccupations en matière de protection de la vie privée n’ont jamais été aussi élevées, et les navigateurs ont commencé à appliquer des limitations sur la fonctionnalité des cookies tiers. En 2019, Safari a commencé à imposer une expiration de 7 jours pour les cookies tiers, et Firefox a commencé à les bloquer par défaut. Au premier trimestre 2024, Google Chrome commencera à bloquer les cookies tiers pour 1 % de ses utilisateurs par défaut, puis pour tous les utilisateurs au deuxième semestre 2024.

En quoi cela vous concerne-t-il ? 

Sans cookies tiers pour être identifiés, les visiteurs sont considérés comme de nouveaux utilisateurs. Avec Safari, cela se produit sept jours après la dernière visite, et si les cookies sont complètement bloqués, le visiteur est considéré comme un nouvel utilisateur chaque fois qu’il consulte une nouvelle page. Les conséquences peuvent être sérieuses : le nombre d’utilisateurs est erronément important, les variations ne tiennent pas la route dans les tests A/B, les données historiques sont dissociées des utilisateurs, et bien d’autres problèmes.

Pour surmonter cette limitation, vous devez utiliser notre cookie DYID sur votre serveur, afin que celui-ci soit reconnu comme un cookie interne et qu’il ne soit pas affecté par ces restrictions.

Comment utiliser le cookie DYID sur votre serveur ?

L’essentiel de la solution repose sur le fait que le cookie DYID doit être défini par l’application principale qui héberge votre site web sur votre domaine. Les cookies définis de cette manière sont considérés comme des cookies internes, et ne sont donc pas affectés par les restrictions et leur période d’expiration peut être plus longue. C’est un élément que vos développeurs doivent inclure dans le code, de la manière suivante :

1. Vérifier si un visiteur arrive sur votre site avec un cookie DYID (il ne s’agit pas de sa première visite). 
2. Si c’est le cas, dupliquez le cookie avec un nouveau nom (_dyid_server), et définissez sa date d’expiration à 1 an. 

Exemple :

Supposons que la valeur du cookie _dyid soit 7237284912004766755. Dupliquez la valeur du cookie dans un nouveau cookie _dyid_server, et définissez la date d’expiration à 1 an en indiquant 31556951 comme valeur de l’attribut max-age.

Voici le résultat : _dyid_server=7237284912004766755;max-age=31556951

Voici le déroulement de cette solution :

1. Un visiteur arrive sur votre site web.
2. Votre serveur (application dorsale) reçoit de la part du navigateur une demande de renvoi d’une page web. Les demandes des utilisateurs qui reviennent incluent le cookie _dyid.
3. Votre serveur d’application exécute les étapes suivantes :
   1. Il vérifie si la demande inclut un cookie _dyid.
   2. S’il trouve le cookie _dyid, il le duplique dans un nouveau cookie _dyid_server. 
   3. Il renvoie ensuite le nouveau cookie sous forme d’en-tête de réponse avec une durée d’expiration d’un an.
      Il s’agit d’un cookie interne côté serveur dans le navigateur du visiteur, qui n’est pas affecté par l’application de la date d’expiration des cookies.
      (Notez que le cookie _dyid continue d’être renvoyé, cela ne devrait pas changer).
4. Notre script utilise maintenant le cookie _dyid_server lorsqu’il s’exécute sur votre page, et votre visiteur voit le contenu de votre site web.

De cette manière, aucune donnée de l’utilisateur n’est perdue, même si l’utilisateur n’a pas visité votre site depuis plus de 7 jours.

Notez que si vous avez activé le Active Cookie Consent mode, il est important d’attendre l’objet de consentement et d’agir en fonction de son résultat. Dans le cas contraire, vous risquez d’écrire des cookies pour des utilisateurs qui n’ont pas donné leur accord.

Exemples de code

Voici quelques exemples de code pour les plateformes et les langages de programmation les plus courants. 

>>> curl -v http://yoursite.example.com --cookie "_dyid=-3233584359067736988"                                                                                                                                                                                                                                                                                        19:55:13
*   Trying 172.217.18.4...
* TCP_NODELAY set
* Connected to yoursite.example.com (172.217.18.4) port 80 (#0)
> GET / HTTP/1.1
> Host: yoursite.example.com
> User-Agent: curl/7.64.1
> Accept: */*
> Cookie: _dyid=-3233584359067736988
>
< HTTP/1.1 200 OK
< Date: Mon, 30 Mar 2020 16:55:16 GMT
...
< Content-Type: text/html; charset=UTF-8
...
< Set-Cookie: _dyid_server=-3233584359067736988; expires=Wed, 29-Apr-2021 16:55:16 GMT; path=/; domain=.google.com; Secure

// a besoin d’un intergiciel cookieParser avant de pouvoir manipuler les cookies
app.use(express.cookieParser());
 
app.use((req, res, next) => {
  if (req.cookies._dyid) { // s’il s’agit d’un utilisateur qui revient et que le cookie DYID existe
    const dyid = req.cookies._dyid;
    res.cookie('_dyid_server', dyid, { // stocke un nouveau cookie côté serveur nommé "_dyid_server" avec la valeur DYID
      expires: new Date(Date.now() + 31540000000000), // définit une durée d’expiration d’un an pour le nouveau cookie
    });
  
  next();
});

...
dyid_cookie = request.COOKIES.get('_dyid') 
if dyid_cookie is not None: # s’il s’agit d’un utilisateur qui revient et que le cookie DYID existe
 set_cookie(‘_dyid_server’, dyid_cookie, 31557600) # stocke un nouveau cookie côté serveur nommé "_dyid_server" avec la valeur DYID...

<?php
if(isset($_COOKIE['_dyid'])) {
 $dyid_cookie = $_COOKIE['_dyid']; /* s’il s’agit d’un utilisateur qui revient et que le cookie DYID existe */
 setcookie('_dyid_server', $dyid_cookie, time() + 31557600); /* expire dans 1 an */
}
...

Implémentation de DYID en tant que cookie interne dans Shopify

Shopify fournit un moyen simple d’implémenter un cookie interne :

1. Sur l’interface d’administration de Shopify, cliquez sur Settings.
2. Cliquez sur Customer Events.
3. Cliquez sur Add Custom Pixel.
4. Copiez et collez le code suivant :

   (async function(){
    const max_age = 30240000;
    const dyid_server = await browser.cookie.get("_dyid_server");
    if (
    dyid_server &&
    dyid_server !== "" &&
    dyid_server !== "null" &&
    dyid_server !== null
    ) {
    browser.cookie.set(`_dyid_server=${dyid_server};max-age=${max_age};path=/`);
    } else {
    const dyid = await browser.localStorage.getItem("_dyid");
    if (dyid) {
    browser.cookie.set(`_dyid_server=${dyid};max-age=${max_age};path=/`);
    }
    }
   })() 

Validation technique

Cette procédure vérifie qu’un cookie côté serveur dénommé _dyid_server a été créé avec la même valeur que le cookie _dyid, mais avec une durée d’expiration d’un an. Cette procédure peut être effectuée sur n’importe quel navigateur, mais nous avons utilisé Chrome dans cet exemple :

1. Ouvrez une nouvelle fenêtre de navigateur et accédez à n’importe quelle page de votre site web contenant le script Dynamic Yield. 
2. Ouvrez la console de développement Chrome (appuyez sur Commande+Option+J (Mac) ou Contrôle+Shift+J (Windows, Linux, Chrome OS). 
3. Cliquez sur l’onglet Network. Sélectionnez Preserve Log puis cliquez sur Clear ⊘ .
   
4. Rafraîchissez la page. Sélectionnez la première requête avec l’URL de votre site (a), et regardez l’onglet Headers (b).
   
5. Vérifiez que la valeur de _dyid_server est identique à celle de dyid.
   La valeur du cookie _dyid_server se trouve dans l’en-tête de la requête. Vous pouvez également trouver la valeur de dyid dans la section Request Headers de l’onglet Headers sous "cookie:" (le premier champ). Si les valeurs correspondent, votre solution est vérifiée.