ใช้ Tag Manager กับนโยบายรักษาความปลอดภัยเนื้อหา

นโยบายรักษาความปลอดภัยเนื้อหา (CSP) เป็นมาตรฐานความปลอดภัยของเว็บที่ได้รับการสนับสนุนอย่างกว้างขวาง ซึ่งมีวัตถุประสงค์เพื่อป้องกันการโจมตีบางประเภทที่อิงตามการแทรกโค้ดโดยให้สิทธิ์นักพัฒนาแอปในการควบคุมทรัพยากรที่แอปพลิเคชันโหลด ใช้คู่มือนี้เพื่อทำความเข้าใจวิธีติดตั้งใช้งาน Google Tag Manager ในเว็บไซต์ที่ใช้ CSP

เปิดใช้คอนเทนเนอร์แท็กเพื่อใช้ CSP

หากต้องการใช้ Google Tag Manager ในหน้าเว็บที่มี CSP คุณต้องอนุญาตให้ CSP เรียกใช้โค้ดคอนเทนเนอร์ Tag Manager ได้ โค้ดนี้สร้างขึ้นเป็นโค้ด JavaScript แบบอินไลน์ที่แทรกสคริปต์ gtm.js คุณทำได้หลายวิธี เช่น การใช้ Nonce หรือ Hash วิธีที่แนะนำคือการใช้ Nonceซึ่งควรเป็นค่าสุ่มที่คาดเดาได้ยากซึ่งเซิร์ฟเวอร์สร้างขึ้น แยกกันสำหรับการตอบสนองแต่ละครั้ง ระบุค่า Nonce ในคําสั่ง script-src-elem ของนโยบายรักษาความปลอดภัยเนื้อหา

Content-Security-Policy:
script-src-elem 'nonce-{SERVER-GENERATED-NONCE}';
img-src www.googletagmanager.com;
connect-src www.googletagmanager.com www.google.com

จากนั้นใช้โค้ดคอนเทนเนอร์ Tag Manager แบบอินไลน์ที่รองรับ Nonce ตั้งค่าแอตทริบิวต์ 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 ไปยังสคริปต์ใดก็ตามที่เพิ่มลงในหน้าเว็บ

นอกจากนี้ยังมีวิธีอื่นๆ ในการเปิดใช้การเรียกใช้สคริปต์แบบอินไลน์ เช่น การระบุ Hash ของสคริปต์แบบอินไลน์ ใน CSP

หากวิธี Nonce หรือ Hash ที่แนะนำไม่สามารถทำได้ คุณสามารถ เปิดใช้สคริปต์แบบอินไลน์ของ Tag Manager ได้โดยการเพิ่มคําสั่ง 'unsafe-inline' ลงในส่วน script-src-elem ของ CSP

คุณต้องมีคําสั่งต่อไปนี้ใน CSP เพื่อใช้วิธีนี้

ตัวแปร JavaScript ที่กำหนดเอง

เนื่องจากวิธีติดตั้งใช้งานตัวแปร JavaScript ที่กำหนดเอง ตัวแปรเหล่านี้ จะประเมินเป็น undefined หากมี CSP เว้นแต่จะมีการระบุคําสั่ง 'unsafe-eval' ในส่วน script-src ของ CSP

โหมดแสดงพรีวิว

CSP ต้องมีคําสั่งต่อไปนี้จึงจะใช้โหมดแสดงพรีวิวของ Google Tag Manager ได้

Google Analytics

CSP ต้องมีคําสั่งต่อไปนี้จึงจะใช้แท็ก Google Analytics ได้ ปลายทางที่ทำเครื่องหมายด้วย ¹ มีไว้สำหรับฟีเจอร์โฆษณาโดยเฉพาะ แต่เราขอแนะนำให้รวมปลายทางเหล่านี้ไว้ในระหว่างการตั้งค่าเริ่มต้นเพื่อที่คุณจะได้ไม่ต้องอัปเดต CSP หากลิงก์ Google Ads ในภายหลัง

¹ ปลายทางโฆษณา: โดเมนเหล่านี้จำเป็นต้องใช้งานอย่างจริงจังสำหรับ การติดตั้งใช้งาน Google Analytics ที่ลิงก์กับ Google Ads หรือใช้ฟีเจอร์โฆษณาเท่านั้น

Google Ads

CSP ต้องมีคําสั่งต่อไปนี้จึงจะใช้แท็ก Conversion, รีมาร์เก็ตติ้ง หรือแท็ก Conversion Linker ของ Google Ads ได้

บีคอนข้อมูลผู้ใช้ Google Ads

CSP ต้องมีคําสั่งต่อไปนี้จึงจะใช้บีคอนข้อมูลผู้ใช้ Google Ads เมื่อทํางานในบริบทที่ปลอดภัยได้

บีคอนข้อมูลผู้ใช้ Google Ads จะไม่ทํางานในบริบทที่ไม่ปลอดภัย ดังนั้นการกำหนดค่า CSP ในกรณีดังกล่าวจึงไม่สามารถใช้ได้

Floodlight

ผู้ใช้ Floodlight สามารถเปิดใช้ CSP ได้โดยใช้การกำหนดค่าต่อไปนี้ แทนที่ค่า <FLOODLIGHT-CONFIG-ID> ด้วยรหัสผู้ลงโฆษณา Floodlight ที่เฉพาะเจาะจง หรือ * เพื่ออนุญาตรหัสผู้ลงโฆษณาใดก็ได้:

สำหรับผู้ใช้ทุกคน

สำหรับบีคอน "สคริปต์ที่กำหนดเอง"

สำหรับแท็กรูปภาพ

Merchant Center

CSP ต้องมีคําสั่งต่อไปนี้จึงจะส่งข้อมูลไปยัง Merchant Center ได้

Service Worker

CSP ต้องมีคําสั่งต่อไปนี้จึงจะใช้ Service Worker สําหรับการจับคู่ที่ปรับปรุงแล้ว บีคอนข้อมูลผู้ใช้ และ Conversion ของโฆษณาได้

แก้ปัญหาด้วยผู้ช่วยแท็ก

หากต้องการแก้ปัญหาเกี่ยวกับนโยบายรักษาความปลอดภัยเนื้อหา (CSP) ให้ใช้ ผู้ช่วยแท็ก ผู้ช่วยแท็กจะแสดงรายการทรัพยากรที่นโยบายรักษาความปลอดภัยเนื้อหาบล็อก

1. เปิด ผู้ช่วยแท็ก แล้วป้อน URL ของเว็บไซต์ เว็บไซต์จะเปิดขึ้นในแท็บใหม่

2. หากนโยบายรักษาความปลอดภัยเนื้อหาในหน้าเว็บของคุณบล็อกทรัพยากร ระบบจะแสดงปัญหา CSP ในส่วนปัญหาของหน้าเว็บ ของผู้ช่วยแท็ก

   

3. เลือกดูปัญหา ข้างปัญหา CSP เพื่อดูรายการทรัพยากรทั้งหมดที่ถูกบล็อกในหน้าเว็บ

4. เพิ่มทรัพยากรที่ถูกบล็อกทั้งหมดลงในนโยบายรักษาความปลอดภัยเนื้อหา