Avec l’application des paramètres SameSite dans les dernières versions de Google Chrome, il est devenu difficile de faire fonctionner les cookies dans des contextes propriétaires et tiers. J’ai déjà couvert ce phénomène dans mon article SameSite, ainsi que dans mon guide pour configurer le suivi sans cookie pour les iframes.
Récemment, Google Analytics a mis à jour ses bibliothèques (App+Web, gtag.js et analytics.js) avec une nouvelle paramètre: cookieFlags
(analytics.js) ou cookie_flags
(Application+Web et gtag.js).
REMARQUE 25 mars 2020: La fonctionnalité n’est pas encore officiellement publiée et des fonctionnalités supplémentaires peuvent être ajoutées à la fonctionnalité avant qu’elle ne soit officiellement documentée. Je mettrai à jour cet article avec toutes les mises à jour, si nécessaire.
Dans ce court article, je vais vous montrer comment l’utiliser pour personnaliser les cookies utilisés par Google Analytics.
Directives sur les cookies
Lorsque vous créez un cookie, vous lui attribuez un Nom et un évaluer. Google Analytics, par exemple, crée un cookie nommé _ga
avec un ID client pseudo-aléatoire généré pour l’instance de navigateur actuelle.
Si vous créez un cookie avec rien d’autre que le nom et la valeur, il possède par défaut les fonctionnalités suivantes :
- Ce sera un session cookie, ce qui signifie qu’il n’a pas d’expiration. Lorsque le navigateur se ferme, tous les cookies de session sont effacés (mais pas toujours).
- Il sera écrit sur le domaine actuel sur lequel se trouve le navigateur.
- Il sera écrit sur le chemin actuel du navigateur.
De plus, dans la dernière version du navigateur Google Chrome, le cookie sera également traité comme ayant le SameSite=Lax
drapeau. Cela signifie que le cookie Ne fera pas fonctionnent lorsqu’ils sont consultés dans un contexte tiers.
Lors du paramétrage d’un cookie, vous pouvez paramétrer ces champs à votre convenance. Les directives disponibles pour la configuration sont :
Directif | La description | Exemple de valeur | Champ Google Analytics |
---|---|---|---|
Expires |
Durée de vie maximale du cookie, spécifiée avec une chaîne de date. | Expires=Tue, 24 Mar 2020 13:37:28 GMT |
cookieExpires et cookie_expires |
Max-Age |
Durée de vie maximale du cookie, spécifiée en secondes. | Max-Age=7200 |
– |
Domain |
Le domaine sur lequel le cookie est écrit. | Domain=simoahava.com |
cookieDomain et cookie_domain |
Path |
Le chemin sur lequel le cookie est écrit. | Path=/ |
– |
Secure |
Le cookie n’est envoyé au serveur que si la demande est faite via HTTPS. | Secure |
– |
HttpOnly |
Empêche l’accès au cookie avec JavaScript. | HttpOnly |
– |
SameSite |
Spécifie le contexte dans lequel le cookie est accessible. | SameSite=Strict |
– |
Comme vous pouvez le voir, il y a certains champs que vous pouvez déjà définir avec des paramètres Google Analytics préexistants, mais il vous manque toujours l’option de configuration tous aspects du cookie.
Le nouveau champ cookieFlags
Le nouveau cookieFlags
champ vous permet de définir quelconque directive cookie lors de la création du cookie Google Analytics.
Naturellement, cela exclut
HttpOnly
car cela n’est disponible que pour les cookies définis dans la réponse HTTP.
La valeur de ce paramètre est une liste séparée par des points-virgules de directives de cookies en minuscules et leurs valeurs respectives. Par exemple, il s’agit d’une valeur possible de cookieFlags
:
max-age=7200;domain=simoahava.com;path=/;secure;samesite=none
Si défini comme la valeur de cookieFlags
il créerait le cookie Google Analytics avec une expiration de deux heures (7200 secondes), placez-le sur le simoahava.com
domaine et sur le chemin racine, et assurez-vous qu’il n’est envoyé qu’avec des requêtes HTTPS et rendre disponible en tant que cookie tiers.
Surtout, cookieFlags
a la priorité si certains des drapeaux ont déjà été définis avec par exemple cookieExpires
et cookieDomain
. S’il y a un conflit, cookieFlags
gagne.
Définir le champ dans analytics.js
Pour définir le champ avec Universal Analytics où vous utilisez un script intégré pour collecter des données (c’est-à-dire pas Google Tag Manager), vous devez le définir comme ceci :
ga('create', 'UA-XXXXX-Y', {
cookieFlags: 'max-age=7200;secure;samesite=none'
});
Le bon endroit pour le cookieFlags
Le paramètre est dans la méthode de création du tracker, intégré dans un objet que vous passez en paramètre au ga()
méthode.
Définir le champ dans gtag.js
Vous pouvez également définir le champ avec une implémentation gtag.js en ligne. Le nom du champ est cookie_flags
plutôt que cookieFlags
.
gtag('config', 'G-N2A3FMNDT5', {
cookie_flags: 'max-age=7200;secure;samesite=none'
});
Définir le champ dans Google Tag Manager
Dans Google Tag Manager, les principaux endroits où vous modifieriez ce champ sont les balises Universal Analytics et les balises de configuration App+Web.
Balise Universal Analytics
Cela inclut la variable Paramètres de Google Analytics.
Le nom du champ est cookieFlags
et la valeur est la chaîne de directives que vous souhaitez définir.
Balise de configuration application + Web
Le nom du champ est cookie_flags
.
Résumé
Il s’agit d’une mise à jour importante des bibliothèques de collecte de données de Google Analytics. Il y a tant scénarios dans lesquels les cookies propriétaires utilisés par Google Analytics doivent être accessibles dans un contexte tiers.
Ces scénarios incluent, par exemple, des flux de réservation intégrés, des formulaires intégrés et des portails de connexion.
Sans régler le samesite=none;secure
flags dans les paramètres de Google Analytics, les cookies créés par GA ne seraient pas disponibles dans un contexte tiers, gâchant ainsi votre capacité à suivre le même utilisateur sur le site parent et dans la ressource intégrée.
Les autres champs sont également utiles – Max-Age
est tellement plus facile à utiliser que Expires
et la mise en place du cookie Secure
par défaut est juste une bonne pratique.
Faites-moi savoir dans les commentaires si vous avez des questions sur ce nouveau paramètre!