`
yhz61010
  • 浏览: 562515 次
  • 来自: -
博客专栏
63c13ecc-ef01-31cf-984e-de461c7dfde8
libgdx 游戏开发
浏览量:12274
社区版块
存档分类
最新评论

什么是beacons - 在Web Analytics中的应用(网站分析的灯塔)

阅读更多
    一直很想写篇关于beacon的文章,今天找资料时,无意间找到了一篇很好的英文文章,写的很好,现将其翻译过来,供大家学习。(省得我自己再写了!哈哈哈!让您见笑了啊!)

英文原文地址:
http://www.seolion.com/how-web-beacons-work/

    友情提示:阅读完本文后,如果您觉得还是有些迷茫,您不妨再仔细阅读下以上的英文原文。由于作者的翻译水平有限,可能有很多地方翻译的不太准确(虽然有些地方我已经阅读原文很多遍,但是有的地方还是觉得翻译的不太好。),请大家多多谅解吧。哈哈哈!!!

    Web beacons通常是一张1*1像素的透明图片,被包含在网页或Email中。它是客户端与Web Analytics数据收集服务器间进行数据交换的桥梁。

    下面让我们看看Web beacons是如何将数据传输到服务器的。

    Web beacons是通过javascript tags实现的。
    (原文:Web beacons through javascript tags)
    通常,Web Analytics数据收集方法是通过javascript tag实现的。每个需要被分析或被跟踪的网页会包含一些javascript的代码。例如,下面是statcounter分析工具(它是免费的,这点很重要)的代码:
<!-- Start of StatCounter Code -->
< script type="text/javascript">
    <!-- var sc_project=2296441; var sc_invisible=1; var sc_partition=21;
    var sc_security="0d580486"; //-->
</ script>
< script type="text/javascript" src="http://www.statcounter.com/counter/counter_xhtml.js">
</ script>
< noscript>
    <div class="statcounter">
        <a class="statcounter" href="http://www.statcounter.com/">
            <img class="statcounter" src="http://c22.statcounter.com/counter.php?sc_project=2296441&java=0&security=0d580486&invisible=1"
            alt="web tracker" />
        </a>
    </div>
</ noscript>
<!-- End of StatCounter Code -->


    让我们来分析一下这段代码。
    前5行代码,是一些和statcounter账号相关的需要被初始化的变量(例如,sc_project, sc_invisible等等)。接下来的一行代码是引用一个statcounter的js文件。
    statcounter的代码做了很多的事情。例如,它会找到当前被访问的页面的referring URL是什么,你使用的浏览器的窗口大小以及你的IP等等。
   
    接下来我们就开始讲解今天的重点:Web beacon.
    Web analytics收集到的数据就是通过statcounter的脚本完成的。在完成上述数据收集的初始化操作之后(前5行代码),收集的数据将会被发送到statcounter的服务器。
    Web beacon(或者称它为“附属图片”)使这一切得以实现。首先,准备一个图片请求用的URL(通常在这个URL中包含了需要被收集的数据的所有变量及数值信息),然后Javascript生成一个<img>标签,其src属性就是刚才准备好的URL。当浏览器在准备显示这个图片时,statcounter.com的脚本会根据请求中的参数(在第一步中已经准备好的)来收集数据,然后statcounter.com会发送一张1*1像素的透明图片作为response(别忘了,它是一个图片请求),并最终在浏览器中显示出来(这一切,对于访问者而言,并没有感觉出有什么变化,因为它只是一张1*1像素的透明图片)。

>(下班了,明天就是中秋了,先回家了啊。放假回来再继续写啊。其它未翻译的部分我先>copy过来了。)(不好意思了各位。)

(中秋的休假太短了,三天一下子就过去了。我的心啊...,现在开始期待十一了!哈哈哈哈!现在继续把中秋前没翻译完的给翻译了。希望大家中秋过的都很愉快,并一起期待十一的到来吧!哈哈哈哈!)

    Web beacons是作为被监测网页的数据传输载体。
    (原文:Web beacons as part of a mobile specific web page)

    您可能注意到以上statcounter代码中的<noscript>部分。在<noscript>的代码中,有一个<img>标签。<img>标签中src属性的URL中就是所包含的一些需要被传递的基本变量信息。当浏览器可识别<script>标签,但无法支持其中的脚本时,<noscript>标签中的内容才会被执行。(如果浏览器支持javascript,那么<noscript>标签中的内容就不会被执行)。在移动设备上打开一个具有监测tag的网站时,通常会包含类似上面的<noscript>标签,此时,noscript中的代码会被执行。
    上面代码示例中的<script>和<noscript>在功能上的区别仅在于,是否有任何javascript代码被引用或发生数据交换。因为,<script>和<noscript>中的代码都会生成<img>图片标签,并且其src属性的值是准备好的URL。但是使用<noscript>时有个限制,不能像<script>所引用的javascript代码所完成的工作那样,在第一步就传递所有需要用到的值(例如,浏览器的窗口大小等),但我们可以在服务器级别控制<img>标签的输出,并找到需要传递的必要数据(如,客户端的IP地址,URL引用等)。(这一段,作者觉得翻译的不太好,大家可以参看英文原文的上下文,再仔细体会下。)

    至此,本文已经为大家介绍了采用page tag方式对网页进行分析的一般方法(page tag方式一般都会使用到beacon),并且还谈到了采取此方法是如何对数据进行收集的。如何您使用过一些网站分析工具的话,如Google Analytics, Omniture SiteCatalyst等(感兴趣的读者,还可以参看我写的《国外主流网站分析工具介绍》这篇文章:http://yhz61010.iteye.com/admin/blogs/709282),您会发现,它们的统计方式和上面讲的基本是一样。不过Omniture还提供了另外一种方法来收集数据,那就是使用Omniture的javascript tag时,你可以预先提供一些想要监测的自定义变量,这样你就可以统计更多的数据,对访问者的行为进行更好的分析。
0
0
分享到:
评论

相关推荐

    react-native-beacons-manager, 响应本机库检测信号( iOS和 Android ).zip

    react-native-beacons-manager, 响应本机库检测信号( iOS和 Android ) react-native-beacons-manager react-native-beacons-manager: 在你的本地应用程序中为iOS和安卓添加信标技术。这个存储库是为了保持存活和最新...

    beacons-integration-源码.rar

    在"beacons-integration-源码.rar"这个压缩包中,我们关注的是一个关于Beacons技术的集成实现。Beacons是一种基于低功耗蓝牙(BLE,Bluetooth Low Energy)的设备,主要用于室内定位、推送通知和物联网(IoT)应用。...

    react-native-beacons-manager:用于检测信标的React-Native库(iOS和Android)

    React本地信标管理器 react-native-beacons-manager :在适用于iOS和Android的React Native应用程序中添加信标技术。 该存储库是为保持生命力而生的,并及时更新了以下3个原始功能: 如果您想了解更多信息,请阅读。...

    Beacons-DiscordBot:天堂和壁炉边MMORPG荒野信标花名册

    《Beacons-DiscordBot: 天堂与壁炉边MMORPG荒野信标花名册详解》 在IT领域,尤其是游戏社区管理中,自动化工具的应用日益普及。"Beacons-DiscordBot"是一个专为《Haven and Hearth: 天堂与壁炉边》(一款大型多人...

    Beacons-Monitor:演示以使用UUID列出所有信标设备

    在压缩包的文件名列表中看到"Beacons-Monitor-master",这通常是一个GitHub项目的主分支,表明源代码和相关资源都包含在这个目录下。项目结构可能包括了Java源代码文件、资源文件、配置文件以及可能的测试用例等。...

    beacons-plugin

    cordova plugin add https://github.com/gpelaez/beacons-plugin.git 观看信标区域/UUID cordova.plugins.ibeacon.addRegion( // Success Callback function() { console.log('added successfully') ; }, /...

    glimworm-beacons-manager-iphone:Glimworm信标配置应用程序

    Glimworm iBeacon配置应用程序iOS 7中的iBeacons API演示应用程序和Glimworm iBeacons的配置工具##谢谢Nick Toumpelis首先,我们要感谢开发了HiBeacons( )并在GitHub上共享它的Nick Toumpelis。 该应用程序的核心...

    ble-beacons-st17h66_fw:BLE信标ST17H66

    标题中的“ble-beacons-st17h66_fw”指的是基于BLE(Bluetooth Low Energy)技术的信标设备,其中“st17h66”是该设备所采用的微控制器型号,通常微控制器是物联网(IoT)设备的核心组件,负责处理数据和执行程序。在...

    service-beacons-python:Python中的样本数据微服务

    在Python中开发数据微服务,可以利用其强大的库生态系统和简洁的语法,为各种业务场景提供灵活的数据解决方案。 一、Python环境搭建与基础 1. **Python解释器**:首先,你需要安装Python解释器,目前推荐使用...

    track-beacons-doc

    您可以使用的来维护和预览Markdown文件中网站的内容。 每当您提交到该存储库时,GitHub Pages都会运行从Markdown文件中的内容重建站点中的页面。 降价促销 Markdown是一种轻巧且易于使用的语法,可用于样式化您的...

    beacons-android:使用信标进行教学辅助的 Android 应用

    信标-android 使用信标进行教学辅助的 Android 应用。 所需的最低 API 级别为 18(Android 4.3+)。 该应用程序需要蓝牙低功耗支持。 这个项目是用 Android Studio 构建的 ... 帮助屏幕,学生可以在实践过程中拨打帮助

    beacons-webapp:信标注册前端

    要在类似生产的环境中运行该应用程序,请执行以下操作: docker-compose up 测验 我们的测试方法: 测试React组件的渲染。 我们使用来确保页面变红是用户期望看到的。 测试逻辑。 通过在src/lib/定义可重用的...

    beacons-integration:信标注册集成

    部署方式开发环境使用配置了,以便在对Webapp,Service和Integration项目存储库的main分支进行任何更改时,将发行版部署到开发环境中。 管道根据Terraform定义文件配置基础结构,并为Webapp和Service部署最新版本的...

    beacon-of-beacons-console:信标网络管理控制台PoC

    项目 AngularJS客户端,由Google Summer of Code 2015支持 配置 在回购中: npm install npm install -g bower bower install npm install -g gulp gulp 在浏览器中转到localhost:8888 。

    meteor-bluetooth-beacons:测距和监视蓝牙信标的React性

    在"meteor-bluetooth-beacons-master"文件中,包含了项目的所有源代码和资源。主要的文件结构可能包括以下部分: 1. **Server端**: Meteor的服务器端代码,负责处理蓝牙信标的数据收集、计算和存储,以及与客户端...

    beacons-service:信标注册后端

    运行测试./gradlew test运行单元测试./gradlew integrationTest运行集成测试./gradlew check运行单元测试和集成测试建筑该服务可以在您选择的IDE中本地构建。 您也可以从命令行进行构建: 并运行测试: ./gradlew ...

    pip-services-beacons-node:Node.is的数据微服务模板

    然后,它使用该信息根据用户的设备在用户周围检测到的UDI对用户的位置进行三角测量。 支持的功能: 部署平台:独立流程,Docker,AWS Lambda 外部API:HTTP(REST和Commandable),GRPC(Custom和Commandable) ...

    beacons-android:CMPE 295A使用信标android应用程序进行基于上下文的产品营销

    信标安卓这是圣何塞州立大学CMPE 295的硕士学位项目。项目名称增强店内购物体验团队成员鲁查·卡塔克瓦尔吉纳利·贾维里(Jinali Jhaveri) 内拉吉·沙玛萨拉斯·库马尔·孙库·古普塔

    dsc-gtm-beacons

    这在 gtm 中集中管理供应商分析,并允许 dsc ember 应用程序专门专注于向 gtm 提供分析有效负载。 内容 angular-checkout-success.html - 现有的“扁平化”结帐成功页面 cms-beacons.html - 由 cms 嵌入到 ^^^ 中的...

Global site tag (gtag.js) - Google Analytics