นโยบายรักษาความปลอดภัยเนื้อหา (CSP) คือมาตรฐานความปลอดภัยบนเว็บที่รองรับอย่างกว้างขวาง ซึ่งมีไว้เพื่อป้องกันการโจมตีบางประเภทที่ใช้การแทรกโดยให้นักพัฒนาแอปควบคุมทรัพยากรที่โหลดโดยแอปพลิเคชันของตนได้ ใช้คู่มือนี้เพื่อทําความเข้าใจวิธีทําให้ Google Tag Manager ใช้งานได้ในเว็บไซต์ที่ใช้ CSP
เปิดใช้คอนเทนเนอร์แท็กเพื่อใช้ CSP
หากต้องการใช้ Google Tag Manager ในหน้าเว็บที่มี CSP นั้น CSP ต้องอนุญาตให้เรียกใช้โค้ดคอนเทนเนอร์ของ Tag Manager ได้ โค้ดนี้สร้างขึ้นเป็นโค้ด JavaScript ในบรรทัดที่แทรกสคริปต์ gtm.js ซึ่งทำได้หลายวิธี เช่น การใช้ Nonce หรือแฮช วิธีที่แนะนำคือการใช้ nonce ซึ่งควรเป็นค่าแบบสุ่มที่คาดเดาไม่ได้ซึ่งเซิร์ฟเวอร์สร้างทีละรายการสำหรับแต่ละคำตอบ ระบุค่า nonce ในคำสั่ง script-src ของนโยบายรักษาความปลอดภัยเนื้อหา ดังนี้
Content-Security-Policy: script-src 'nonce-{SERVER-GENERATED-NONCE}'; img-src www.googletagmanager.com
จากนั้นใช้โค้ดคอนเทนเนอร์ของ Tag Manager แบบอินไลน์เวอร์ชันที่ไม่มีการรับรู้ ตั้งค่าแอตทริบิวต์ nonce ในองค์ประกอบสคริปต์ในหน้าเป็นค่าเดียวกันนี้
<!-- Google Tag Manager -->
<script nonce='{SERVER-GENERATED-NONCE}'>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;var n=d.querySelector('[nonce]');
n&&j.setAttribute('nonce',n.nonce||n.getAttribute('nonce'));f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXX');</script>
<!-- End Google Tag Manager -->
จากนั้น Tag Manager จะเผยแพร่ค่า Nonce ไปยังสคริปต์ที่เพิ่มลงในหน้าเว็บ
วิธีอื่นๆ ที่เปิดใช้การดำเนินการสคริปต์ในหน้าได้ เช่น การระบุแฮชของสคริปต์ในหน้าใน CSP
หากวิธีการแบบ Nonce หรือแฮชที่แนะนำไม่สามารถทำได้ คุณเปิดใช้สคริปต์ในหน้าของ Tag Manager ได้โดยการเพิ่มคำสั่ง 'unsafe-inline' ลงในส่วน script-src ของ CSP
คุณต้องมีคำสั่งต่อไปนี้ใน CSP จึงจะใช้วิธีการนี้ได้
script-src: 'unsafe-inline' https://www.googletagmanager.com
img-src: www.googletagmanager.com
ตัวแปร JavaScript ที่กำหนดเอง
เนื่องจากมีการนำตัวแปร JavaScript ที่กำหนดเองมาใช้ ตัวแปรจะทำการประเมินเป็น undefined ใน CSP เว้นแต่ว่าจะมีคำสั่ง 'unsafe-eval' ในส่วน script-src ของ CSP
script-src: 'unsafe-eval'
โหมดแสดงตัวอย่าง
หากต้องการใช้โหมดแสดงตัวอย่างของ Google Tag Manager นั้น CSP ต้องมีคำสั่งต่อไปนี้
script-src: https://googletagmanager.com https://tagmanager.google.com
style-src: https://googletagmanager.com https://tagmanager.google.com https://fonts.googleapis.com
img-src: https://googletagmanager.com https://ssl.gstatic.com https://www.gstatic.com
font-src: https://fonts.gstatic.com data:
Google Analytics 4 (Google Analytics)
หากต้องการใช้แท็ก Google Analytics 4 (Google Analytics) CSP ต้องมีคําสั่งต่อไปนี้
script-src: https://*.googletagmanager.com
img-src: https://*.google-analytics.com https://*.googletagmanager.com
connect-src: https://*.google-analytics.com https://*.analytics.google.com https://*.googletagmanager.com
สำหรับการทำให้ Google Analytics 4 (Google Analytics) ใช้งานได้โดยใช้ Google Signals นั้น CSP ต้องมีคำสั่งต่อไปนี้
script-src: https://*.googletagmanager.com
img-src: https://*.google-analytics.com https://*.analytics.google.com https://*.googletagmanager.com
https://*.g.doubleclick.net https://*.google.com https://*.google.<TLD>
connect-src: https://*.google-analytics.com https://*.analytics.google.com
https://*.googletagmanager.com https://*.g.doubleclick.net https://*.google.com https://*.google.<TLD>
Universal Analytics (Google Analytics)
หากต้องการใช้แท็ก Universal Analytics (Google Analytics) CSP ต้องมีคำสั่งต่อไปนี้
script-src: https://www.google-analytics.com https://ssl.google-analytics.com
img-src: https://www.google-analytics.com
connect-src: https://www.google-analytics.com
Conversion ของ Google Ads
หากต้องการใช้แท็ก Conversion ของ Google Ads นั้น CSP ต้องมีคำสั่งต่อไปนี้
เพื่อการเชื่อมต่อที่ปลอดภัย
script-src: https://www.googleadservices.com https://www.google.com https://www.googletagmanager.com
img-src: https://googleads.g.doubleclick.net https://www.google.com https://google.com
frame-src: https://www.googletagmanager.com
สำหรับการเชื่อมต่อที่ไม่ปลอดภัย
script-src: www.googleadservices.com www.google.com www.googletagmanager.com
img-src: googleads.g.doubleclick.net www.google.com google.com
รีมาร์เก็ตติ้งของ Google Ads
หากต้องการใช้แท็กรีมาร์เก็ตติ้งของ Google Ads นั้น CSP ต้องมีคำสั่งต่อไปนี้
เพื่อการเชื่อมต่อที่ปลอดภัย
script-src: https://www.googleadservices.com https://googleads.g.doubleclick.net https://www.google.com
img-src: https://www.google.com https://google.com
frame-src: https://bid.g.doubleclick.net https://td.doubleclick.net
สำหรับการเชื่อมต่อที่ไม่ปลอดภัย
script-src: www.googleadservices.com googleads.g.doubleclick.net www.google.com
img-src: www.google.com google.com
frame-src: bid.g.doubleclick.net td.doubleclick.net
บีคอนข้อมูลผู้ใช้ Google Ads
หากต้องการใช้บีคอนข้อมูลผู้ใช้ Google Ads เมื่อทำงานในบริบทที่ปลอดภัย CSP ต้องมีคำสั่งต่อไปนี้
script-src: https://www.googletagmanager.com
frame-src: https://www.googletagmanager.com
บีคอนข้อมูลผู้ใช้ Google Ads จะไม่ทำงานในบริบทที่ไม่ปลอดภัย การกำหนดค่า CSP ในกรณีเหล่านั้นจึงไม่เกี่ยวข้อง
Floodlight
ผู้ใช้ Floodlight จะเปิดใช้ CSP ได้โดยใช้การกำหนดค่าต่อไปนี้ แทนที่ค่า <FLOODLIGHT-CONFIG-ID> ด้วยรหัสผู้ลงโฆษณา Floodlight ที่เฉพาะเจาะจง หรือ * เพื่ออนุญาตรหัสผู้ลงโฆษณาใดก็ได้ดังนี้
สำหรับผู้ใช้ทุกคน ให้ทำดังนี้
img-src: https://<FLOODLIGHT-CONFIG-ID>.fls.doubleclick.net
frame-src: https://td.doubleclick.net
สําหรับบีคอน "สคริปต์ที่กําหนดเอง" ใน Tag Manager
frame-src: https://<FLOODLIGHT-CONFIG-ID>.fls.doubleclick.net
สำหรับแท็กรูปภาพ
img-src: https://ad.doubleclick.net
สําหรับโหมดความยินยอม
img-src: https://ade.googlesyndication.com