javascript - 在 React google Analytics 中应用错误处理

Question

我在 React 应用程序中使用 react-ga ( https://www.npmjs.com/package/react-ga ) 模块，以便我可以将事件发送到 Google Analytics。

我已阅读 react-ga 的文档，但在将数据发送到 Google Analytics 后找不到响应的方法。

我发送数据的方式是这样的:

import *  ReactGA from 'react-ga'

  function sendEvent(category: string, action: string, label: string) {
    ReactGA.event({
      category,
      action,
      label,
    });
  }

  function sendPageView(title: string, url: string) {
    ReactGA.set({ page: title });
    ReactGA.send()
    ReactGA.pageview(url);
  }

这些只是对 google-analytics 的调用，没有任何反馈，我正在寻找的是一个获取回调的函数或执行上述操作的异步函数。

向 go​​ogle-analytics 发出 POST 请求:。

实际上，每次我发送事件时，都会有一个自动 POST 请求，该请求会在响应时获取 1。(我无法控制POST 请求)
请求如下所示:请求 URL:https://www.google-analytics.com/j/collect?v=1&_v=...。

我试图完成的任务是捕获错误并将其发送到 Sentry 服务器:。

• 如果 Google 分析服务器没有响应，则会出现错误
• 如果 google-analytics.com 的响应超时，则会出现错误。

可能这个模块的功能受到限制，有其他人使用类似的东西并设法得到任何类型的错误吗？

谢谢。

Answer 1

我根据官方的谷歌分析文档解决了这个问题:https://developers.google.com/analytics/devguides/collection/analyticsjs/field-reference#hitCallback

我附上解决方案，供引用:

1. 发送事件并在完成后调用回调函数:

    ReactGA.ga('send', 'event', 'Page view' {
      hitCallback: (res: any) => {
        console.log('*** page view event success.');
        return true;
      },
    });

发送一个事件并将其计时为1秒。 如果到那时没有执行回调，我会引发超时错误，否则我会执行成功代码:

 let alreadyCalled: boolean = false;
    function myCode(timeout: boolean, hasResponded: boolean) {
      if (alreadyCalled) return;

      alreadyCalled = true;

      if (timeout === true && hasResponded === false) {
        // TODO, THROW AN ERROR AND SEND TO SENTRY
        console.log('Time out error, sending message to Sentry..');
      } else if (timeout === false && hasResponded === true) {
        // TODO, send event success
        console.log('send event to google-analytics, success');
      }
    }

    ReactGA.ga('send', 'event', 'pageview', { hitCallback: () => myCode(false, true) });
    setTimeout(() => myCode(true, false), 10);

我希望它可以帮助任何需要类似东西的人。