个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我想为 Google Analytics 和 Intercom 创建一个类似的代码片段:
对讲示例 https://developers.intercom.com/installing-intercom/docs/basic-javascript
//Set your APP_ID
var APP_ID = "APP_ID";
window.intercomSettings = {
app_id: APP_ID
};
(function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',w.intercomSettings);}else{var d=document;var i=function(){i.c(arguments);};i.q=[];i.c=function(args){i.q.push(args);};w.Intercom=i;var l=function(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/' + APP_ID;var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);};if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})();
或Google Analytics:
Adding analytics.js to Your Site
The analytics.js library is a JavaScript library for measuring how users interact with your website. This document explains how to add analytics.js to your site.
The JavaScript measurement snippet
Adding the following code (known as the "JavaScript measurement snippet") to your site's templates is the easiest way to get started using analytics.js.
The code should be added near the top of the <head> tag and before any other script or CSS tags, and the string 'GA_MEASUREMENT_ID' should be replaced with the property ID (also called the "measurement ID") of the Google Analytics property you wish to work with.
Tip: If you do not know your property ID, you can use the Account Explorer to find it.
<!-- 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 -->
Intercom 和 Google 使用哪些设计模式来创建此代码片段？他们内部工作如何？您能给我一个基本结构，以便我可以用我想要的功能填充它吗？
最佳答案
Google Analytics(adn Intercom)的 IIFE 基本上是他们编写适用于所有浏览器的脚本加载器的最短方法。
如果我们完整地写出速记，结构就会变得更容易阅读:
window.GoogleAnalyticsObject = 'ga';
window.ga = window.ga || function() {
window.ga.q = window.ga.q || [];
window.ga.q.push( arguments );
},
window.ga.l = 1 * new Date();
var a = document.createElement( 'script' );
var m = document.getElementsByTagName( 'script' );
a.async = true;
a.src = 'https://www.google-analytics.com/analytics.js';
m.parenNode.insertBefore( a, m );
window.ga('create', 'UA-XXXXX-Y', 'auto');
window.ga('send', 'pageview');
Intercom 示例基本上执行相同的操作。
因此该脚本首先保证窗口对象上存在正确的名称。如果 google Analytics 对象已经存在，它将被使用，否则它将成为将数据保存在数组中的函数。这可以防止多次添加脚本，因此如果另一个插件也尝试加载相同的脚本，它们将共享其 GA 实例。
然后该脚本创建一个新的脚本标记并将其配置为实际 google 分析脚本的 url。一旦新创建的脚本标签添加到页面，它将加载实际的 analytics.js脚本。
虽然我还没有看过analytics.js的细节，但我很确定它会解压或合并我们创建的 window.ga 对象，并将其替换为实际的分析脚本。
总而言之，这是一种奇特的书写方式 <script src="https://www.google-analytics.com/analytics.js">这将适用于旧浏览器，并且将确保如果在单个页面上加载多个脚本实例，我们不会有多个脚本实例相互冲突。
analytics.js 脚本和对讲小部件脚本的实际内部工作原理不包含在这些加载器脚本中，因此我不会详细介绍它们的工作原理，这应该是一个不同的问题，显示以下行实际的analytics.js脚本的代码。
编辑:
window.ga = window.ga || function() {
这一行确保 window.ga是一个函数。为了简单起见，我们假设这是一个页面 ga尚不存在。
所以当我们调用ga('create', 'UA-XXXXX-Y', 'auto');时和ga('send', 'pageview');我们运行以下语句:
window.ga.q = window.ga.q || [];
window.ga.q.push( arguments );
window.ga.q = window.ga.q || [];确保 window.ga.q 是一个数组。然后window.ga.q.push( arguments );将参数插入其中。
打电话ga('create', 'UA-XXXXX-Y', 'auto');和ga('send', 'pageview');在加载分析脚本之前，会产生以下结果:
window.ga.q = [
[ 'create', 'UA-XXXXX-Y', 'auto' ],
[ 'send', 'pageview' ]
];
记住，window.ga是一个函数，但函数也是 JavaScript 中的一种对象。所以我们可以添加属性q函数与 window.ga 相同是一个对象，该函数仍然有效。
加载分析脚本后，它将查看 window.ga.q数组并运行所有这些命令。
问题是，查看analytics.js 脚本。它也是以相同的风格编写的，因此需要几个小时才能重写它并替换所有简写，因此我会尝试寻找该脚本的带注释的非缩小源(如果它在某处可用)。
关于javascript - Google Analytics 或 Intercom 等片段使用哪种设计模式？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56186677/
25
4
0
这里的这个问题对 updating Google Sheets charts linked to Google slides 有一个简洁的解决方案. function onOpen() { var
我正在尝试将 Google 表单添加到 Google 类作业中，但似乎不可能。 首先，它在这里 ( https://developers.google.com/classroom/reference/
出于某种原因，无论我做什么以及我如何尝试，这个日期格式化程序都不起作用。工具提示仍然显示错误的格式。你可以试试代码here . 在代码中我必须注释掉 formatter.format(dataTabl
我目前正在使用访问 token 和刷新 token 从 Google Analytics Reporting API (v4) 中提取数据。当我致力于自动从 Google Analytics 中提取数
我已在 Google 云端硬盘中创建了一个文件夹，例如测试一下，放入3个文件 a.jpg, b.jpg, c.jpg 我希望在同一帐户下的 Google 电子表格中访问文件，例如生成图像文件的链接，可
电子表格 A 是欢迎新移民来到我们小镇的团队的主数据源。它里面有大量非常敏感的数据，不能公开，哪怕是一点点。 (我们谈论的是 child 的姓名和出生日期以及他们在哪里上学……保证电子表格 A 的安全
有没有办法在 Google 文档中编写 Google Apps 脚本以从 Google 表格中检索仅限于非空白行的范围并将这些行显示为表格？ 我正在寻找一个脚本，用于使用 Google Apps 脚本
有没有办法在 Google 文档中编写 Google Apps 脚本以从 Google 表格中检索仅限于非空白行的范围并将这些行显示为表格？ 我正在寻找一个脚本，用于使用 Google Apps 脚本
尝试检索存储在 google firebase 中名为条目的节点下的表单条目，并使用谷歌工作表中的脚本编辑器附加到谷歌工作表。 我已将 FirebaseApp 库添加到谷歌表脚本编辑器。然后我的代码看
是否可以将我的 Web 应用程序的登录限制为仅限 google 组中的帐户？ 我不希望每个人都可以使用他们的私有(private) gmail 登录，而只能使用我的 google 组中的用户。 最佳答
我们想使用 Google 自定义搜索实现 Google 附加链接搜索框。在谷歌 documentation , 我发现我们需要包含以下代码来启用附加链接搜索框 { "@context"
我想将特定搜索词的 Google 趋势图表添加到我的 Google Data Studio 报告中，但趋势不是数据源列表中的选项。我也找不到嵌入 JavaScript 的选项。是否可以将趋势图表添加到
是否可以将文件从 Google Drive 复制到 Google Cloud Storage？我想它会非常快，因为两者都在类似的存储系统上。 我还没有看到有关无缝执行此操作的任何方法的任何信息，而无需
之间有什么区别 ga('send', 'pageview', { 'dimension1': 'data goes here' }); 和 ga('set', 'dimension1', 'da
我正在尝试记录每个博客站点作者的点击率。 ga('send', 'pageview'); (in the header with the ga code to track each page) ga(
我设置了 Google Tag Manager 和 2 个数据层变量:一个用于跟踪用户 ID，传递给 Google Analytics 以同步用户 session ，另一个用于跟踪访问者类型。 在使用
我在我们的网站上遇到多个职位发布的问题。 我们在加拿大多个地点提供工作机会。所有职位页面都包含一个“LD+JSON ”职位发布的结构化数据，基于 Google 的职位发布文档: https://dev
公司未使用 Google 套件，使用个人(消费者)帐户(甚至是 Google 帐户)违反公司政策。 需要访问 Google Analytics - 没有 Google 帐户是否可能？ 谢谢 最佳答案
我想分析人们使用哪些搜索关键字在 Play 商店中找到我的应用。 那可能吗？我怎么能这样做？ 最佳答案 自 2013 年 10 月起，您可以关联您的 Google Analytics(分析)和 Goo
Google Now 和 Google Keep 中基于时间和位置的提醒与 Google Calendar 事件提醒不同。是否有公共(public) API 可以访问 Now 和 Keep 中的这些事
我是一名优秀的程序员,十分优秀！