我们正在尝试在Chrome扩展程序中实施Google Analytics。这些是我们采取的步骤:
我们的manifest.json
编辑为:
"Content-Security-Policy": "default-src 'self'; script-src 'nonce-4AEemGb0xJptoIGFP3Nd'",
而我们的index.html
:
<head>
<meta charset="utf-8">
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'XXXXX', 'auto');
ga('send', 'pageview');
</script>
<script async src='https://www.google-analytics.com/analytics.js' nonce="4AEemGb0xJptoIGFP3Nd"></script>
<!-- End Google Analytics -->
</head>
我们尝试使用hash,nonce和unsafe inline但是都给出了这个错误代码:
我没有想法。
谷歌提供tutorial on adding GA to Chrome extensions:
Installing the tracking code
如果使用
ga.js
协议加载当前页面,则标准Google Analytics跟踪代码段会从受SSL保护的URL中提取名为https://
的文件。 Chrome扩展程序和应用程序只能使用受SSL保护的ga.js
版本。 Chrome的默认内容安全策略不允许在不安全的HTTP上加载ga.js
。这个以及Chrome扩展程序托管在chrome-extension://
架构下的事实,需要稍微修改通常的跟踪代码段,以直接从ga.js
而不是默认位置拉https://ssl.google-analytics.com/ga.js。以下是异步跟踪API的修改代码段(修改后的行以粗体显示):
(function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = 'https://ssl.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })();
您还需要确保您的扩展程序可以通过放宽默认内容安全策略来加载资源。 manifest.json中的策略定义可能如下所示:
{ ..., "content_security_policy": "script-src 'self' https://ssl.google-analytics.com; object-src 'self'", ... }
这是一个弹出页面(popup.html),它通过外部JavaScript文件(popup.js)加载异步跟踪代码并跟踪单个页面视图:
<!DOCTYPE html> <html> <head> ... <script src="popup.js"></script> </head> <body> ... </body> </html>
var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-XXXXXXXX-X']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = 'https://ssl.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })();