GTMのカスタムテンプレートとサンドボックス化JavaScript入門｜未経験から100日後にGTMのプロになる話【Day 61】

ここから20日間は「高度な活用編」として、カスタム実装寄りの話を扱います。未来予測はDay41・54で扱った内容と重複するので繰り返さず、初回の今日は「カスタムテンプレート」という、まだ触れていない仕組みから始めます。

カスタムHTMLタグとカスタムテンプレートの違い

この連載でここまで扱ってきたコードは、基本的に「カスタムHTML」タグに生のJavaScriptを書く形でした。もう1つの選択肢が「カスタムテンプレート」です。GTMのテンプレートエディタで、独自のタグ・変数・トリガーの雛形を作成し、コミュニティギャラリーで公開されているテンプレートや、自社の他コンテナで再利用できるようにする仕組みです。

カスタムテンプレートは「サンドボックス化されたJavaScript」で書く

ここが一番の技術的なポイントです。カスタムテンプレートのコードは、通常の生のJavaScriptではなく、GTMが用意した「サンドボックス化されたJavaScript」という制限付きの環境で書きます。document.cookieを直接読み書きするのではなく、readCookie()やsetCookie()のような、GTMが提供する専用のAPI関数を経由してのみ操作できます。ネットワークリクエストもsendPixel()やinjectScript()といった専用APIを使います。

この制限には理由があります。Custom HTMLタグは何でも自由に書けてしまう反面、何をしているかの見通しが立てにくいのに対し、サンドボックス化されたAPIを使うテンプレートは、「このテンプレートはCookieの読み取りと外部スクリプトの読み込みだけを行う」といった形で、使用する権限が自動的に検出され、利用者に明示されます。カスタムHTMLタグより制約は多いですが、その分「このタグが何をしているか」を第三者が確認しやすくなっています。

コミュニティギャラリーのテンプレートを使うときの注意

GTMのコミュニティテンプレートギャラリーには誰でもテンプレートを公開できるため、品質にはばらつきがあります。導入前に、そのテンプレートが要求している権限一覧を確認する習慣をつけてください。単純なタグ配信用のテンプレートなのに、不必要にCookieの読み書きや外部ドメインへの通信の権限を要求している場合は、そのテンプレートの中身（多くはソースが公開されています）を確認するか、導入を見送る判断も必要です。Day35で触れた「ブラウザから直接外部APIを叩くことの危険性」と根っこは同じ考え方です。

今日のまとめ

自由度の高いカスタムHTMLタグと、制限はあるが権限が可視化されるカスタムテンプレート、それぞれの特性を理解して使い分けてください。特に社外で公開されているテンプレートを使う場合は、要求される権限を必ず確認する習慣をつけましょう。次回は、GTMを活用した高度なデータ分析と最適化を扱います。