Korzystanie z Menedżera tagów z Content Security Policy

Content Security Policy (CSP) to powszechnie obsługiwany standard zabezpieczeń sieciowych, który ma zapobiegać niektórym typom ataków opartych na wstrzykiwaniu kodu, dając deweloperom kontrolę nad zasobami wczytywanymi przez ich aplikacje. Z tego przewodnika dowiesz się, jak wdrożyć Menedżera tagów Google w witrynach, które korzystają z CSP.

Włączanie tagu kontenera na potrzeby korzystania z CSP

Aby można było używać Menedżera tagów Google na stronie z zasadami CSP, muszą one zezwalać na wykonywanie kodu kontenera Menedżera tagów. Ten kod jest tworzony jako wbudowany kod JavaScript, który wstrzykuje skrypt gtm.js. Można to zrobić na kilka sposobów, np. za pomocą liczby jednorazowej lub hasha. Zalecaną metodą jest użycie liczby jednorazowej, która powinna być niemożliwą do odgadnięcia losową wartością generowaną przez serwer osobno dla każdej odpowiedzi. Podaj wartość liczby jednorazowej w dyrektywie Content-Security-Policy script-src-elem jako nonce-{SERVER-GENERATED-NONCE} i użyj wersji kodu kontenera Menedżera tagów, która obsługuje liczbę jednorazową. Ustaw atrybut nonce w elemencie skryptu wbudowanego na tę samą wartość:

<!-- 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 -->

Menedżer tagów będzie następnie przekazywać liczbę jednorazową do wszystkich skryptów, które dodaje do strony.

Istnieją inne sposoby umożliwienia wykonywania skryptu wbudowanego, np. podanie haszu skryptu wbudowanego w CSP.

Jeśli zalecane podejście z liczbą jednorazową lub hashem nie jest możliwe, możesz włączyć skrypt wbudowany Menedżera tagów, dodając dyrektywę 'unsafe-inline' do sekcji script-src-elem w CSP.

Aby można było korzystać z tego podejścia, CSP musi zezwalać na:

Niestandardowe zmienne JavaScriptu

Ze względu na sposób implementacji niestandardowych zmiennych JavaScript w przypadku CSP będą one miały wartość undefined, chyba że w sekcji script-src CSP podano dyrektywę 'unsafe-eval'.

Tryb podglądu

Aby można było korzystać z trybu podglądu Menedżera tagów Google, CSP musi zezwalać na:

Google Analytics

Aby można było korzystać z Google Analytics, CSP musi zezwalać na:

Aby korzystać z Google Analytics bez żadnych funkcji Google Ads, standard CSP musi zezwalać na:

Google Ads

Aby można było używać tagu konwersji z reklam Google Ads, tagu remarketingowego lub tagu łączącego konwersje, zasady CSP muszą zezwalać na:

Dane użytkownika Google Ads

Aby używać sygnałów nawigacyjnych dotyczących danych użytkownika Google Ads w bezpiecznych kontekstach, standard CSP musi zezwalać na:

Sygnał nawigacyjny danych użytkownika Google Ads nie działa w niebezpiecznych kontekstach, więc konfiguracja CSP w takich przypadkach nie dotyczy.

Floodlight

Aby można było używać Floodlight, CSP musi zezwalać na:

Aby można było używać niestandardowych skryptów Floodlight, CSP musi też zezwalać na te elementy (oprócz wymienionych powyżej):

Merchant Center

Aby można było korzystać z Merchant Center, CSP musi zezwolić na:

Brama tagów Google dla reklamodawców

Gdy używasz bramy tagów Google dla reklamodawców, tag Google jest wczytywany ze ścieżki pomiarowej w Twojej witrynie (np. https://www.example.com/metrics) i wysyła do niej dane. Niektóre tagi nadal wysyłają żądania do domen Google, więc zachowaj dyrektywy podane dla każdej usługi i zezwól na:

Upewnij się, że sieć CDN lub serwer WWW nie dodają nagłówka Content-Security-Policy witryny do odpowiedzi ze ścieżki pomiaru. W przeciwnym razie przeglądarka może zablokować skrypt service worker.

Tagowanie po stronie serwera

Gdy tag Google wysyła dane do kontenera serwera, CSP musi też zezwalać na serwer tagowania. Te dyrektywy nie zastępują dyrektyw wymienionych w przypadku poszczególnych usług, takich jak https://www.googletagmanager.com. To, co dodasz, zależy od tego, gdzie jest hostowany Twój serwer tagowania:

W konfiguracji z tą samą domeną serwer tagowania jest wyświetlany ze ścieżki w Twojej witrynie (np. https://www.example.com/metrics). W konfiguracji z subdomeną zastąp TAGGING_SERVER_DOMAIN domeną serwera tagowania (np. sgtm.example.com).

W przypadku konfiguracji w tej samej domenie upewnij się, że sieć CDN lub serwer WWW nie dodają nagłówka Content-Security-Policy witryny do odpowiedzi ze ścieżki tagowania. W przeciwnym razie przeglądarka może zablokować skrypt service worker.

Skrypt service worker

Tag Google używa skryptu service worker tylko wtedy, gdy korzystasz z bramy tagów Google dla reklamodawców lub tagowania po stronie serwera. Dyrektywy wymagane w przypadku poszczególnych konfiguracji znajdziesz w artykułach Brama tagów Google dla reklamodawców i Tagowanie po stronie serwera. Jeśli używasz obu, dostawca usług komunikacyjnych musi zezwolić na oba.

Rozwiązywanie problemów za pomocą rozszerzenia Tag Assistant

Aby rozwiązać problemy ze standardem Content Security Policy (CSP), użyj narzędzia Tag Assistant. Tag Assistant wyświetli listę zasobów, które są blokowane przez standard Content Security Policy.

1. Otwórz rozszerzenie Tag Assistant i wpisz adres URL swojej witryny. Otworzy się nowa karta z Twoją witryną.

2. Jeśli standard Content Security Policy na Twojej stronie blokuje zasób, w sekcji Problemy ze stroną w rozszerzeniu Tag Assistant pojawi się problem z CSP.

   

3. Kliknij Wyświetl problem obok problemu z CSP, aby wyświetlić listę wszystkich zablokowanych zasobów na stronie.

4. Dodaj wszystkie zablokowane zasoby do standardu Content Security Policy.