اندازه گیری برنامه تک صفحه ای با gtag.js

این صفحه نحوه استفاده از gtag.js را برای اندازه‌گیری تعاملات با صفحات در سایت‌هایی که محتوا را به صورت پویا و بدون بارگذاری کامل صفحه سنتی بارگذاری می‌کنند، توضیح می‌دهد.

بررسی اجمالی

برنامه تک صفحه ای (SPA) یک برنامه وب یا وب سایتی است که تمام منابع مورد نیاز برای پیمایش در یک سایت را در بارگذاری صفحه اول بارگیری می کند. همانطور که کاربر روی لینک ها کلیک می کند و با صفحه ارتباط برقرار می کند، محتوای بعدی به صورت پویا بارگیری می شود. این برنامه اغلب URL را در نوار آدرس به‌روزرسانی می‌کند تا پیمایش صفحه سنتی را شبیه‌سازی کند، اما هیچ‌گاه درخواست کامل صفحه جداگانه‌ای انجام نمی‌شود.

تگ گوگل با وب سایت های سنتی به خوبی کار می کند زیرا هر بار که کاربران صفحه جدیدی را بارگذاری می کنند کد قطعه اجرا می شود. با این حال، برای برنامه‌های تک صفحه‌ای که سایت محتوای صفحه جدید را به‌جای بارگیری کامل صفحه به صورت پویا بارگیری می‌کند، کد قطعه gtag.js فقط یک بار اجرا می‌شود. این بدان معناست که بازدیدهای بعدی (مجازی) صفحه باید به صورت دستی به عنوان بارگذاری محتوای جدید اندازه گیری شوند.

اندازه گیری بازدید از صفحه مجازی

هنگامی که برنامه شما محتوا را به صورت پویا بارگیری می کند و URL را در نوار آدرس به روز می کند، URL صفحه ذخیره شده با gtag.js نیز باید به روز شود. سپس می توانید تغییرات آدرس سایت خود را به عنوان بازدید از صفحه اندازه گیری کنید.

برای تنظیم مسیر گزارش‌های gtag.js، از دستور set برای تعیین مقداری برای پارامتر page_path استفاده کنید:

gtag('set', 'page_path', page_path);
gtag('event', 'page_view');

مثلا:

gtag('set', 'page_path', '/new-page.html');
gtag('event', 'page_view');

بعد از اینکه مقدار جدید را برای page_path اضافه کردید، همه رویدادهای بعدی که به آن ویژگی ارسال می‌شوند از آن مقدار جدید استفاده می‌کنند.

مدیریت چندین URL برای یک منبع

برخی از SPA ها فقط هنگام بارگذاری پویا محتوا، بخش هش URL را به روز می کنند. این عمل می تواند به موقعیت هایی منجر شود که بسیاری از مسیرهای صفحه مختلف به یک منبع اشاره می کنند. در چنین مواردی، معمولاً بهتر است یک URL متعارف انتخاب کنید و فقط آن مقدار page_path را به Google Analytics ارسال کنید.

برای مثال، وب‌سایتی را در نظر بگیرید که صفحه «درباره ما» آن از طریق هر یک از نشانی‌های اینترنتی زیر قابل دسترسی است:

  • /about
  • /#/about
  • /home/#/about

برای جلوگیری از تکرار در گزارش‌های خود، بهتر است همه این صفحات را با استفاده از /about برای page_path ضبط کنید.