a

Câu hỏi Theo dõi sự kiện trong google analytics khi nhấp vào gửi biểu mẫu


Tôi cần theo dõi sự kiện trong phân tích google khi ai đó điền vào biểu mẫu và nhấp vào gửi. Trang kết quả xuất hiện là trang loại trang tổng quan chuẩn, do đó, để theo dõi sự kiện trên trang đó, tôi phải chuyển vào sự kiện trong url và sau đó đọc url và xuất mã theo dõi sự kiện google analytics dựa trên nó. Đây là một trang thường xuyên được đánh dấu trang và trang được tải lại, được nhấp lại, v.v. Vì vậy, tôi thực sự không muốn vượt qua các sự kiện theo dõi trong URL và đẩy mạnh phân tích.

Thay vào đó, tôi muốn làm điều gì đó giống như mã jQuery sau đây trên trang với biểu mẫu:

$('#form_id').submit(function() {
  _gaq.push('_trackEvent', 'my category', 'my action');
});

Vấn đề tôi lo ngại ở trên là tôi sẽ bỏ lỡ một số sự kiện đang được theo dõi bởi vì ngay lập tức sau khi gọi javascript đó trình duyệt sẽ gửi biểu mẫu và đi đến một trang web khác. Nếu hình ảnh theo dõi utm.gif không được tải đúng lúc, tôi nhớ sự kiện :(.

Nỗi sợ của tôi có hợp lý không? Làm cách nào để đảm bảo tôi không bỏ lỡ các sự kiện đang được theo dõi?


61
2017-11-03 11:30


gốc


Bạn sẽ bỏ lỡ các sự kiện, vâng: Tôi đã gặp vấn đề này. Nếu biểu mẫu đang BẬT thông tin, yêu cầu POST đó sẽ ẩn yêu cầu GET của Google Analytics báo cáo sự kiện cho GA (và dẫn đến một lỗi khó hiểu trong bảng điều khiển Chrome- ít nhất là 11.0.696.65. - lucasrizoli


Các câu trả lời:


Chỉ có 2 cách để đảm bảo, 100%, rằng tất cả các hình thức gửi (trong số những người dùng đã kích hoạt JS và những người không chặn GA) như sau:

  • Bạn có thể thực hiện gửi AJAX, và sau đó không phải lo lắng về việc trang thay đổi, và do đó có tất cả thời gian trên thế giới để GA xử lý VÀ trang mới của bạn sẽ tải thay cho trang cũ.
  • Bạn có thể buộc biểu mẫu mở hành động của nó trong một cửa sổ mới, do đó để lại tất cả các quy trình nền trên trang chính đang hoạt động và ngăn chặn tình trạng cuộc đua mà bạn lo lắng.

Lý do cho điều này là Google Analytics không có chức năng gọi lại, do đó bạn không bao giờ có thể chắc chắn mình đang chụp tất cả các của các lần gửi, ngay cả khi bạn đặt độ trễ 10 giây.

Cách khác, bạn chỉ có thể chuyển giá trị GET đến trang đã gửi và thiết lập một kiểm tra trên trang đó cho giá trị. Nếu thiết lập của nó, bạn có thể gửi một cuộc gọi trackEvent.


17
2017-11-13 14:55



Cửa sổ mới không phải là một tùy chọn. Tuy nhiên, phương pháp AJAX có thể giúp gì? Làm cách nào để tôi có thể mở trang mới thay cho trang cũ trong khi hình ảnh phân tích google đang được tải? - at.
@at nó sẽ về mặt kỹ thuật là cùng một trang, chỉ nội dung mới được tải động bằng JavaScript, tùy thuộc vào kết quả, làm cho nó 'cảm thấy' như một trang mới cho người dùng cuối. Tuy nhiên, vì trang sẽ không rời khỏi trước khi ga.js được thực hiện xây dựng yêu cầu __utm.gif, sẽ không có cơ hội bị gián đoạn, vì vậy điều này sẽ cung cấp một cái nhìn chính xác hơn về số lượng các lần gửi đang xảy ra. - Yahel
@yc cảm ơn, bây giờ tôi hiểu ý bạn là gì. hmm .. Trang web phụ thuộc rất nhiều vào việc liên kết, nhấn nút quay lại và những thứ khác đã khiến tôi rất ý thức về việc có một trang web riêng biệt cho mỗi chế độ xem và hành động. Tuy nhiên, tôi đoán chúng tôi có thể thay đổi URL thành URL / current_form_page # redirect = new_page. Mọi lần gửi ajax sẽ chỉ thay thế toàn bộ <body> bằng trang mới và đặt url tương ứng. Truy cập url đó trực tiếp hoặc tải lại mặc dù sẽ dẫn đến chuyển hướng đến trang được chỉ định. Bạn không chắc chắn vấn đề sẽ phát sinh, nhưng tôi sẽ cung cấp cho bạn câu trả lời được chấp nhận. - at.
Đối với những người dùng Google trong tương lai về vấn đề này, google Analytics làm hiện có chức năng gọi lại. Đơn giản chỉ cần vượt qua một đối tượng tại đối số cuối cùng với một hitCallback tài sản là một hàm. - CoreDumpError


Sử dụng Google Analytics hitCallback

Bạn có thể chỉ định một hàm gọi lại tùy chỉnh trên đối tượng trình theo dõi.

_gaq.push(['_set', 'hitCallback', function(){}]);

Cuộc gọi lại được gọi sau khi "lần truy cập được gửi thành công".

Nếu bạn muốn theo dõi nhấp chuột vào nút gửi và gửi biểu mẫu sau đó bạn có thể sử dụng mã sau (sử dụng jQuery) cho sự kiện của bạn:

var _this = this; // The form input element that was just clicked
_gaq.push(['_set','hitCallback',function() {
    $(_this).parents('form').first().submit(); // Submit underlying form
}]);
_gaq.push(['_trackEvent', 'My category', 'My action']);
return !window._gat; // Ensure that the event is bubbled if GA is not loaded

Hoặc là onclickmột lớp lót cho bạn <input type="submit"> thành phần:

onclick="var _this=this;_gaq.push(['_set','hitCallback',function(){$(_this).parents('form').first().submit();}]);_gaq.push(['_trackEvent','My category','My action']);return !window._gat;"

Nó làm gì để theo dõi sự kiện My category/My action, sử dụng jQuery để tìm phần tử biểu mẫu cơ bản của nút gửi vừa được đẩy và sau đó gửi toàn bộ biểu mẫu.

Xem: Google Analytics - Gửi dữ liệu đến Google Analytics - Lượt gọi lại (cảm ơn supervacuo)

CẬP NHẬT Nếu bạn đang sử dụng mã analytics.js hiện đại có hàm ga () được xác định, bạn có thể viết mã này như sau:

var _this = this;
ga('send', 'event', 'My category', 'My action', {
    'hitCallback': function() {
        $(_this).parents('form').first().submit();
    }
});

return !window.ga;

143
2017-09-17 14:34



Điều này làm việc tuyệt vời, tuy nhiên tôi đã tìm thấy rằng tôi cần phải xóa các cuộc gọi lại sau khi nó cháy với _gaq.push (['_ set', 'hitCallback', null]); Khác lửa gọi lại lần nữa nếu người dùng nhấn nút 'quay lại' và sau đó thực hiện một số thao tác khác trên trang gây ra một _gaq.push khác. Tôi đã phải làm điều này trên Android để ngăn chặn các cuộc gọi lại bắn nhiều lần sai. - George Armhold
Điều này hoạt động hoàn hảo tốt cho đến khi không có kết nối internet hoạt động (làm việc trong mạng LAN sans văn phòng internet, ví dụ). Một khi internet bị ngắt kết nối, các sự kiện gọi lại không cháy! - Anand Sainath
@AnandS đó có thể là do bạn không thể nhận được phản hồi từ google ... có nghĩa là cuộc gọi lại sẽ không bao giờ được gọi. - kmiyashiro
Làm thế nào về trường hợp khi google-analytics.js bị chặn? ga vẫn được xác định tuy nhiên gọi lại sẽ không hoạt động. Tôi đã thêm trường hợp bên dưới (câu trả lời cho google analytics universal). Sẽ là tuyệt vời nếu bạn sẽ cập nhật bạn trả lời (mà sẽ tiết kiệm thời gian người khác). Dù sao cảm ơn cho câu trả lời đó! - Dmytro Pastovenskyi
@DmytroPastovenskyi Đó là một điểm quan trọng mà mọi người nên biết khi nhìn vào câu trả lời này. - BadHorsie


Đối với những người đối phó với google analytics phổ biến và thực hiện một số mẹo với hitCallback (sự kiện theo dõi fx sau khi xác thực nhưng trước khi gửi biểu mẫu), hãy nhớ rằng google-analytics.js có khả năng bị chặn, tuy nhiên chức năng ga sẽ vẫn được xác định, do đó, hãy gửi sẽ không xảy ra.

ga('send', 'pageview', event, {
  'hitCallback': function() {
    _this.submit();
  }
})
return !window.ga;

Có thể được khắc phục bằng xác thực kiểm tra xem ga có được tải không

ga('send', 'pageview', event, {
  'hitCallback': function() {
    _this.submit();
   }
})
return !(ga.hasOwnProperty('loaded') && ga.loaded === true)

12
2017-07-07 14:30



Mã này được cho là được bọc bên trong một hàm? Tôi không hiểu return tuyên bố chỉ treo ở đó. Tôi đang thiếu gì? Cảm ơn. - Julián Landerreche


Câu hỏi này là một vài năm nay, và có vẻ như là google phân tích đã cung cấp một cách để làm điều này mà không có hack cho ở trên.

Từ tài liệu phân tích google:

Ngoài các mảng lệnh, bạn cũng có thể đẩy các đối tượng hàm vào hàng đợi _gaq. Các hàm có thể chứa bất kỳ JavaScript tùy ý nào và giống như các mảng lệnh, chúng được thực hiện theo thứ tự mà chúng được đẩy lên _gaq.

Bạn có thể kết hợp điều này với nhiều lệnh đẩy để làm cho aboslute chắc chắn rằng chúng được thêm vào theo thứ tự (và lưu một cuộc gọi).

$('input[type="submit"]').click(function(e) {
    // Prevent the form being submitted just yet
    e.preventDefault();

    // Keep a reference to this dom element for the callback
    var _this = this;

    _gaq.push(
        // Queue the tracking event
        ['_trackEvent', 'Your event', 'Your action'],
        // Queue the callback function immediately after.
        // This will execute in order.
        function() {
            // Submit the parent form
            $(_this).parents('form').submit();
        }
    );
});

7
2017-11-01 14:40



Công việc vừa ý? Có vẻ như nó sẽ lần đầu tiên theo dõi sự kiện, tải hình ảnh utm.gif. Sau đó, nó sẽ gửi biểu mẫu, nhưng vẫn có cơ hội đó, biểu mẫu sẽ đưa bạn đến trang khác trước khi tệp utm.gif được tải (tuy nhiên một phần nó cần tải để đăng ký sự kiện). - at.
Sau khi nghiên cứu thêm, có một số thông tin chi tiết từ câu trả lời SO này dường như kết thúc trong sự không chắc chắn: stackoverflow.com/questions/3427580/…. Bất kể kịch bản GA thực sự như thế nào, có một số khuyến nghị khác đáng xem trên trang đó. - epocsquadron
Tuy nhiên, một câu trả lời tương tự khác nói rằng đó là không: stackoverflow.com/a/8147110/1123438 - epocsquadron
Một lưu ý khác: trình gỡ lỗi ga không báo cáo nó là một thành công trước khi trang được để lại. - epocsquadron
Mã này không hoạt động như chức năng sẽ được thực thi ngay lập tức mà không cần chờ sự kiện được theo dõi - Eugene Fidelin


Nếu bạn không quá lo lắng về độ chính xác 100%, bạn chỉ có thể bị chậm trễ 1 giây.

$('#form_id').submit(function(e) {
  var form = this;
  e.preventDefault(); // disable the default submit action

  _gaq.push('_trackEvent', 'my category', 'my action');

  $(':input', this).attr('disabled', true); // disable all elements in the form, to avoid multiple clicks

  setTimeout(function() { // after 1 second, submit the form
    form.submit();
  }, 1000);
});

6
2017-11-03 11:51



@at Suy nghĩ về nó, điều này sẽ được khá nhiều chính xác 100%, ngay cả khi yêu cầu HTTP không được hoàn thành. Sự kiện chính là yêu cầu được nhận bởi các máy chủ của Google - việc hoàn thành yêu cầu HTTP chỉ dành cho phản hồi của khách hàng. 1 giây sẽ cung cấp cho bạn một cái gì đó rất gần với 100 độ chính xác. - lonesomeday
@lonesomeday không tạo ra một vòng lặp vô hạn? Không gọi formsubmit () ở cuối chỉ cần gọi chức năng này một lần nữa và một lần nữa? - Yahel
@yc Không, bởi vì đó là hành động gửi của phần tử DOM, không phải đối tượng jQuery, vì vậy nó không gọi trình xử lý jQuery. - lonesomeday
@lonesomday ah. bạn đúng về điều đó, nhưng không đúng về độ chính xác 100%. Độ trễ là với tạo ra yêu cầu HTTP. GA không làm điều đó ngay lập tức. Đầu tiên nó phải tạo ra yêu cầu trong JavaScript. Nó thường nhanh chóng, nhưng một lần nữa, không thể đoán trước trên các trình duyệt trường hợp cạnh. - Yahel
@yc Thú vị - Tôi không quen thuộc với GA, và chắc chắn không phải với phần này của nó. Tôi không hoàn toàn thấy làm thế nào điều này sẽ làm thay đổi quan điểm về độ chính xác - chắc chắn không có nhiều trình duyệt sẽ mất một giây để tạo ra một yêu cầu HTTP. - lonesomeday


Khi giải pháp hitCallback tốt, tôi thích đặt cookie và kích hoạt sự kiện từ trang tiếp theo. Bằng cách này, lỗi trong GA sẽ không ngừng trang web của tôi:

// Function to set the event to be tracked:
function setDelayedEvent(category, action, label, value) {
  document.cookie='ev='+escape(category)+'!'+escape(action)+'!'+escape(label)+'!'+value
      +'; path=/; expires='+new Date(new Date().getTime()+60000).toUTCString();
}

// Code run in every page, in case the previous page left an event to be tracked:
var formErrorCount= formErrorCount || 0;
var ev= document.cookie.match('(?:;\\s*|^)ev=([^!]*)!([^!]*)!([^!]+)!([^!]+)(?:;|\s*$)');
if (ev && ev.length>2) {
  _gaq.push(['_trackEvent', unescape(ev[1]), unescape(ev[2]),
     unescape(ev[3]), parseInt(ev[4])]);
  document.cookie='ev=; path=/; expires='+new Date(new Date().getTime()-1000).toUTCString();
}

6
2018-05-16 07:02





Đây là cách bạn thực hiện gọi lại sự kiện trong gtag.js, để đảm bảo dữ liệu Google Analytics được gửi trước khi bạn thay đổi URL trang:

gtag('event', 'view_promotion', { myParameter: myValue, event_callback: function () {
    console.log('Done!');
    // Now submit form or change location.href
} });

Nguồn: https://developers.google.com/analytics/devguides/collection/gtagjs/sending-hits


2
2017-11-02 09:27





Được rồi vì chúng tôi đã chuyển sang Universal analytics, tôi muốn trả lời như vậy bằng cách sử dụng GTM và UA.


GTM:

Theo dõi sự kiện trong google analytics khi nhấp vào gửi biểu mẫu khá dễ dàng khi sử dụng GTM.

  • Tạo thẻ UA và đặt loại event trong GTM.
  • Điền hành động sự kiện, danh mục và nhãn mong muốn của bạn
  • Tạo trình kích hoạt loại Gửi biểu mẫu.
  • Đặt thêm điều kiện để nhắm mục tiêu nút bạn mong muốn

Đây là cách tiếp cận tốt nhất, tối ưu và dễ dàng nhất cho OP.

enter image description here


1
2018-05-23 05:13