Question

我在JS中创建了一个小型库，为我们的客户进行一些分析。

到目前为止，我们将其包含在</body>标记附近，如下所示：

<script type="text/javascript" src="https://cdn.myapp.net/main.min.js"></script>
<script type="text/javascript">
     MyLib.init("idofthecustomer");
</script>

但显然，它并没有在某些浏览器上运行。我查看过其他分析库，他们以多种不同的方式包含他们的脚本。

堆：

<script type="text/javascript">
    window.heap=window.heap||[],heap.load=function(e,t){window.heap.appid=e,window.heap.config=t=t||{};var r=t.forceSSL||"https:"===document.location.protocol,a=document.createElement("script");a.type="text/javascript",a.async=!0,a.src=(r?"https:":"http:")+"//cdn.heapanalytics.com/js/heap-"+e+".js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(a,n);for(var o=function(e){return function(){heap.push([e].concat(Array.prototype.slice.call(arguments,0)))}},p=["addEventProperties","addUserProperties","clearEventProperties","identify","removeEventProperty","setEventProperties","track","unsetEventProperty"],c=0;c<p.length;c++)heap[p[c]]=o(p[c])};
    heap.load("YOUR_APP_ID");
</script>

GoogleAnalytics：

<!-- Google Analytics -->
<script>
(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();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', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->

为什么他们这样做？你能解释一下这个目标是什么吗？

另一方面，我们如何确保我们的脚本将被加载并运行？

感谢您的回答！

Answer 1

许多统计信息是使用javascript加载的，而不是“经典<script>应答”，因为出于不同原因：

如果脚本已在页面
允许开发异步库加载
对于noobs来说，它更易于使用，只能复制一个不可读的脚本

如果您的库未在所有浏览器上一直加载，则可能不是集成错误。

至少有21％的互联网用户使用统计广告拦截器
并不总是允许Javascript（通常是机器人，很多机器人）
有些浏览器不允许跨域（对js库收费或者main.min.js发送跨域请求）
IE有一个硬跨站点脚本过滤器（XSS Protection）

如果有人看到其他原因，您可以编辑我的答案;）

Answer 2

您是否确定页面上正在加载脚本？检查标头中的Access-Control-Allow-Origin的值，因为您没有在自己的网站中包含JS文件。如果

，浏览器会阻止外部JS文件

访问控制允许来源

未设置为

*

或定义的域名。

--- --- UPDATE

我的猜测是某个时候文件加载得足够快，然后调用你的函数并且它可以工作，但有时会在加载文件之前执行函数。

Minified version of this code

window._ls = function(e,t){var a=document.createElement("script");a.type="text/javascript",a.readyState?a.onreadystatechange=function(){("loaded"===a.readyState||"complete"===a.readyState)&&(a.onreadystatechange=null,t())}:a.onload=function(){t()},a.src=e,document.getElementsByTagName("head")[0].appendChild(a)}

然后你就可以使用这样的代码，

_ls("https://cdn.myapp.net/main.min.js",function(){MyLib.init("idofthecustomer")})

加载

2 个答案: