这节跟大家分享一下Google Analytics的数据传输机制。
一般来说，我跟大家介绍Google Analyitcs的传输机制的时候，通常直接说是通过虚拟一像素的形式是实现数据的传输的，但是实际上，这个只是其中的一种形式，Google Analytics中实际是由3种向服务器发送数据的方式的，但另外两种很少用到，所以没怎么介绍，对于普通用户，知道用虚拟一像素去实现数据的传递就行了，这一节的内容是相对比较深入的。
默认情况下，analytics.js 会选择 HTTP 方法和传输机制以优化匹配的发送。使用这种机制时有三种选项，分别为：
- image：使用 Image 对象
- xhr：使用 XMLHttpRequest 对象
- beacon：使用新的 navigator.sendBeacon 方法
Image
就是虚拟一像素的形式了，这是目前使用多的一种方式，反应在网络传输过程就是你可以看到一个带有collect字段的一个请求，这个大家应该很熟悉的了，传递的数据都是在url上，对url的长度是有限制的，如单hits是8K，多hits是16k。可以在浏览器中的network找到包含collect的请求：
发送的方法是GET，请求的链接就是要传递的信息。
xhr
什么是 XMLHttpRequest 对象？
XMLHttpRequest 对象用于在后台与服务器交换数据。XMLHttpRequest 对象是开发者的梦想，因为你能够：
- 在不重新加载页面的情况下更新网页
- 在页面已加载后从服务器请求数据
- 在页面已加载后从服务器接收数据
- 在后台向服务器发送数据
所有现代的浏览器都支持 XMLHttpRequest 对象，但旧的浏览器是不支持的。这是一种与服务交互数据的方式，能够传递更多数据，但是请求消耗会比较多。
这种方式在GA中的设置我是没找到的明显案例，但我觉得是在GTM中要设置的字段里面中将transport设置的xhr。
beacon
beacon是指通过浏览器向服务器异步地发送小的HTTP数据，使用 Beacon方法，将会使用户代理在有机会时异步地向服务器发送数据，同时不会延迟页面的卸载或影响下一导航的载入性能。这就解决了提交分析数据时的所有的问题：使它可靠，异步并且不会影响下一页面的加载。
当前浏览器对Beacon的支持情况：
- Chrome 37+
- Firefox (Gecko) 31+
- Internet Explorer 不支持
- Opera 24+
- Safari 不支持
- 手机端常用浏览器不支持：Android浏览器支持了，但是iOS尚无支持
beacon可以在谷歌分析设置变量中的更多设置的要设置字段里面去设置，有个useBeacon的字段，设置为true，你也可以用transport，然后将值是设置为beacon，这对于以下情况很有帮助：你希望在用户即将离开你的网站之前跟踪某个事件，同时不延迟用户的导航操作。如果浏览器不支持 navigator.sendBeacon，将以常规方式发送匹配。
如果你使用这种方式，你可以去看看network下发送的请求：
这里方法是POST，而且传输的链接上面不显示一大串的信息。
analytics.js 会尝试根据匹配规模和浏览器功能来确定最佳方法。如果你指定了“beacon”，而用户的浏览器不支持“navigator.sendBeacon”方法，则 analytics.js 会转而使用 “image”或“xhr”，具体取决于匹配规模。
也即是如果你设置了beacon的方式传递数据，而你的浏览器支持，就走beacon的方式，如果不支持，就会走其他的方式将数据传递出去。
这几种方法可以说是为了解决页面unload时快速跳转的时候如果要上报当前数据，采用xhr的同步上报方式，会阻塞当前页面的跳转；使用Image有可能遇到阻止，导致无法成功发送。所以最好的方式是使用浏览器来提供发送保障的更简洁的sendBeacon方法。sendBeacon是异步的，不会影响当前页到下一个页面的跳转速度，且不受同域限制。
这种情况应该是不多的，对数据准确要求很高的需要注意这方面吧，至少我在实施过程中是没有这样去用的。
