非常に最小限のGoogle Analytics
私は解決策を探し始めた.それの不足のために、私はヒットとミスアプローチによって私のものを作成することに決めました、そして、私はそれをしたと思います.それはわずか1キロバイト以上の小型化重量.その目的は、Google Analytics 4プロパティで当社のウェブサイト上でページビューを追跡することです.
最小解析論4 -コード
Version 1.03.04042022 (1.03 from 04/04/2022)
<script>
function a(){const l="G-XXXXXXXXXX";var n="XXXXXX",s,v;n=="XXXXXX"?(s=()=>{}):(s=()=>n);const o=()=>Math.floor(Math.random()*1e9)+1,i=()=>Math.floor(Date.now()/1e3),g=()=>(sessionStorage._p||(sessionStorage._p=o()),sessionStorage._p),p=()=>(localStorage.cid1||(localStorage.cid1=o()),localStorage.cid1),f=()=>(localStorage.cid2||(localStorage.cid2=i()),localStorage.cid2),u=()=>(sessionStorage.sid||(sessionStorage.sid=i()),sessionStorage.sid),t="1",d=()=>{if(sessionStorage.sct){var e=+sessionStorage.getItem("sct")+ +t;sessionStorage.sct=e}else sessionStorage.sct=t;return sessionStorage.sct},c=encodeURIComponent,h=e=>{var n=[],t;for(t in e)e.hasOwnProperty(t)&&e[t]!==void 0&&n.push(c(t)+"="+c(e[t]));return n.join("&")},m=!1,r="https://www.google-analytics.com/g/collect",a=h({v:"2",tid:l,gtm:s(),_p:g(),sr:(screen.width+"x"+screen.height).toString(),ul:(navigator.language||void 0).toLowerCase(),cid:(p()+"."+f()).toString(),_s:"1",dl:document.location.origin+document.location.pathname+document.location.search,dt:document.title||void 0,dr:document.referrer||void 0,sid:u(),sct:d(),seg:"1",en:"page_view",_ss:"1",_dbg:m?1:void 0}),e=r+"?"+a;console.log(r,a),console.log(e),navigator.sendBeacon?navigator.sendBeacon(e):(v=new XMLHttpRequest,v.open("POST",e,!0))}a()
</script>
Official Google Analytics 4, Global Site Tag (gtag.js) = 171kB
Snippet (minified) slightly over 1kB (without script tag)
スニペットは、Google Analytics 4に直接ページビューを送信します
/g/collect ) そして、同じユーザによってダミーエントリを生成するのを防ぐために、LocalStorageとSessionStorageの若干のメトリックを我々のブラウザーに格納します.おかげで、我々は公式スクリプトをロードする必要はありませんし、当社のウェブサイトの読み込み速度は影響を受けません.
If you need to load the official script (taking a risk that it will be blocked by AdBlockers, you can still do this together with the JavaScript delay approach described here Google Universal Analytics property is shutting down. Here is what you need to know..
最小解析論4 -セットアップ
上記のスクリープをコピーして、あなたのウェブサイトに貼り付けてください
<head> . 置換G-XXXXXXXXXX あなたのトラッキングIDを使用すると、Google Analytics 4を設定するときに受信し、あなたが行く準備が整いました.Make sure, when you paste your code in
<head>of the document after the<title>tag.
そのsnipped重量にもかかわらず、公式のスクリプトより少ないトンにもかかわらず、様々なadblockersによってブロックするために責任があります.しかし、それに対する解決策があります(あなたのHOSTプロバイダがリダイレクト200を設定することができるなら).後述するマスキングソリューションを参照ください.
マスキング（隠れ）要求
私のサイトはNetlify そして、彼らは
_redirects ファイルで典型的なリダイレクトを設定しない200 ( OK )、プロキシURLとして動作します.200 Code informs about successful processing of the request.
私の規則は次のように見える
/g/collect https://www.google-analytics.com/g/collect 200
https://www.google-analytics.com/g/collect
https://dariusz.wieckiewicz.org/g/collect
/g/collect?v=2&tid=G... ずっと後に? はペイロードです).There is another option to pass the payload of the URL through more advanced redirect as explained on Masking (hiding) Google Analytics 4 code
This solution has its downsides as described in my other post Prevent Google Analytics from being blocked by AdBlocker – The Downside.
JavaScriptは私が毎日使っているものではありません.使用するMinimal Analytics 打ち抜かれるDavid Künnen 私のビルドをガイドとして、それは期待通りに動作します.
コードは無料です、あなたはそれ以上の開発のための“基地”と呼ぶことができます.JavaScriptの知識があれば、それ以上の開発に役立つことができます.
See the full code on Gist/GitHub .
あなたがより技術的であるならば、あなたは、これがどのように造られたか、そして、各々の要素が意味するものを知っていたいです、以下の技術仕様を読んでください.
最小の解析論4 -技術仕様
コードの技術的な記述のビット.
ページビューのトラッキングを一緒に収集データ(ペイロード)を使用してGoogleに送信されます
https://www.google-analytics.com/g/collect URL.This URL is likely to be blocked by AdBlockers or DuckDuckGo extension to Internet Browser resulting that many visits (in my calculations around 40%) are not measured. This is why, despite the downside, a masking solution can help with that.
ペイロード
data ) がシリアル形式で追加され、v=2 , GA 4用測定プロトコルバージョン2tid=G-XXXXXXXXXX , GA 4用の測定IDgtm=XXXXXX , Google Tag Managerのように見えますが、これがグローバルサイトタグで使用される方法の説明がないので、未定義です.一部の人々は、しかし、確認するのが難しいAdSense IDとしてこれを参照します.私の追跡の1つに、それは見えます2oe3n1 ; _p=4723978523 , もう一つの値は、未知の目的でペイロードで送られます.公式ドキュメンテーションの欠如のために、私はランダムとしてそれがn桁数を生成したと仮定しました.それがセッションごとにユニークである必要がある場合、それはブラウザーSessionStorageに格納されます;sr=1920x1080 , 画面の解像度;ul=en , 訪問ユーザー言語;cid=1659736851.1648993429 , ブラウザーLocalStorageでクライアントIDを持ちます.ユーザーからの新しいユーザーを識別します.ランダム生成、2つのn桁の数字のセット;_s=1 , セッションヒットカウント;dl=https://... , 追跡ページのURL;dt=Title , ページのタイトル;dr=https://... , ユーザーが異なるページまたはサイトからページを追跡するようになると、これはreferrer URLを保持しますsid=1648993317 , ユニークなセッション(ページ訪問)IDを保持して、ブラウザSessionStorageでそれを保存しています.日付関数に基づいて生成;sct=1 , セッション参加係.ユーザーが少なくとも10秒の間ウェブサイトと対話するならば、公式に設定されなければなりません(相互作用が起こったと仮定してください).この値は増加する+1 ユーザーが現在のセッションで当社のウェブサイト上の他のページを訪問するときen=page_view , カウントイベント、私たちのインスタンスのページビューで.このコードを変更することができます別のイベントでトリガ;_ss=1 , 新しいセッションとして訪問を数える_dbg=1 , デバッグのセクションで、Google Analyticsのウェブサイトに記録されているデバッグにAnalyticsを有効にします.url ペイロードdata URLを組み合わせて作成fullurl そして、そのような形で送られます.あなたが気がつくように、スクリプトからの要求は予想された解決を通して送られません
navigator.sendBeacon(url, data) よりむしろ(url+"?"+data) . 理由がわからないが、どういうわけか(url, data) アプローチは何かが失われ、ページビューは記録されません、一方、他の解決に関してそれはそうです.SessionStorage、LocalStorageを掃除して、ブラウザーコンソールでURLの出力をペイロードで表示するためにいくつかのコメントされた部品があります.すべての動作を解析したい場合は、このコメントを外してください.
このコードは、Google Analytics 4で次の年の解決策を提供しますDavid's minimal analytics ユニバーサルAnalytics(GA 3)の前に提供されます.
以下への残高
Reference
この問題について(非常に最小限のGoogle Analytics), 我々は、より多くの情報をここで見つけました https://dev.to/idarek/a-very-minimal-google-analytics-4-snippet-37cgテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol