我们有一个用Typescript编写的扩展程序,可在Chrome,Firefox和Edge上使用,并向其中添加了Google Analytics(分析)。为此,我们创建了一个简单的文件来加载Google Analytics(分析):
import { environment } from "../environment";
(function (i, s, o, g, r, a, m) {
i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
(i[r].q = i[r].q || []).push(arguments)
}, i[r].l = 1 * new Date().getTime(); a = s.createElement(o),
m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m)
})(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
ga('create', environment.googleAnalyticsTrackingCode, 'auto');
ga('set', 'checkProtocolTask', function () { }); // Removes failing protocol check. @see: http://stackoverflow.com/a/22152353/1958200
ga('require', 'displayfeatures');
然后,我们使用webpack进行构建,并在我们拥有的popup.html中引用文件。我们添加了对NPM软件包的引用:
“ @ types / google.analytics”:“ ^ 0.0.39”
然后,我们可以从弹出式js文件中调用ga函数,如下所示:
ga('send', 'pageview', url);
我们还对清单进行了修改,包括:
“ content_security_policy”:“ script-src'self' https://www.google-analytics.com; object-src'self'“
一切在Chrome中都可以正常运行,我们看到在Google Analaytics中记录的页面浏览量,但是在Firefox和Edge中,没有对Google Analytics(分析)的请求,但是也没有任何类型的错误,它命中了ga函数,但没有任何反应。
在Firefox和Edge中,我们还有其他要做的事情吗?
我们应用程序的结构是,内容脚本在页面上创建一个iframe,然后将popup.html加载为该iframe的src。在Firefox / Edge中,但在Chrome上没有限制,该限制会影响以这种方式构造的扩展程序上的Google Analytics(分析)吗?
比较网络请求,左侧为Chrome,右侧为Firefox:
我也进行了修改,因此它从后台记录了页面视图。再次,这在Chrome中工作正常,但在Edge / Firefox中不工作,但没有错误。