Cookiebotを使ったWEB上でEmbedしたYouTube動画を確実に表示できるようにする

はじめに

クラスメソッドタイランドの三並です。

Cookiebotは、GDPRなどの個人情報保護法に対応した、WEBサイトのCookie管理及びCookie確認バナー表示のツールです。2021年5月からタイで始まるPDPA（タイの個人情報保護法）の対応にも役立つツールとなっています。

CookiebotをWEBサイトに導入すると、WEB内で使われているサードパーティのCoookieについても承認が必要になります。例えば、YouTubeやGoogleMapなどのツールでもCookieが使用されていますので、これもCookieとして管理する対象になります。

発生した問題

Cookiebotを導入すると、Cookiebotは自動でWEBページをスキャンし、Cookieを自動で分類します。

この際、Youtubeが作るCookieは自動でマーケティングに分類されます。 ユーザーはWEBへのアクセス時に設定情報（Preference）、統計（statistics）、マーケティング（marketing）に分類されたものは、ユーザーの意志でチェックを外すことができます。必須（necessary）に分類されているCookieは、WEBを参照するために必須のCookieということでチェックを外すことはできません。（このCookieを承認しないとWEBの参照ができなくなります）

YoutubeのCookieは分類されたマーケティングのチェックを外すと、ユーザーはembedされた動画を見れなくなるという状況になります。通常は問題ないかと思いますが、動画がそのページにおいて必須のコンテンツの場合は、これだと困ることがあります。この場合の解決策を以下に書きます。

解決策

YouTubeのCookieを必須（necessary）に分類することで、上記の問題を回避します。

１．

YouTubeのembedタグが以下のようになっていたとします。

<iframe src="https://www.youtube.com/embed/a9__D53WsUs" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

ウェブページの中に貼り付けるYouTubeのembedタグを以下のように修正します。

<iframe data-cookieconsent="necessary" src="https://www.youtube.com/embed/a9__D53WsUs" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

ポイントは、 data-cookieconsent="necessary" の部分になります。

２．

Cookiebotのコンソールにログインして、画面上部のCookiesをクリックします。 Cookieのスキャンがされていない場合は、「SCAN DOMAIN NOW」 をクリックして、Cookieの認識をさせてください。

次に、この画面内をしたにスクロールしていき、YouTubeに関連したCookieを探します。 Providerが「youtube.com」になっているものの設定を行います。 これらのCategoryを「Necessary」に変更します。

すべてのYouTube関連のCookieの設定を変更したら、Saveを押します。

これで設定は完了です。

３．

最後にWEBページにアクセスして、Cookiebotのバナー表示で、必須（necessary）のカテゴリに、YouTubeのCookieが含まれていることを確認してください。