【Cookie同意のボタンを実装したい】
背景:Googleアナリティクスのデータの収集目的だけでは、同意の確認は不要だが、同意ボタンが自作可能か検証した。
目標：同意ボタンを押すとGoogleタグの機能を許可し、Cookieの取得を開始
結果：公式サイトを参照し設定したところ、analytics_storageについて、目標の挙動をとることがGoogleアナリティクスで確認された。
方法：<head>タグに下記コードを追加し、ボタンを用意した。ボタンが押された時に、consentGrantedAll()を実行させる。
<script async src=”https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXX”></script>の記述も忘れないこと。
参考サイト(公式): https://developers.google.com/tag-platform/security/guides/consent?hl=ja#gtag.js_1
var allCookies = document.cookie;
var result = allCookies.indexOf('gtagGranted');
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
if(result == -1){
// Define dataLayer and the gtag function.
// Set default consent to 'denied' as a placeholder
// Determine actual values based on your own requirements
gtag('consent', 'default', {
'ad_storage': 'denied',
'ad_user_data': 'denied',
'ad_personalization': 'denied',
'analytics_storage': 'denied'
});
}
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', 'G-XXXXXXXX');
function consentGrantedAll() {
gtag('consent', 'update', {
'ad_storage': 'granted',
'ad_user_data': 'granted',
'ad_personalization': 'granted',
'analytics_storage': 'granted'
});
document.cookie = 'gtagGranted=ok;path=/';
}
