简单的分析插件
与简单的分析结合 简单的分析
简单的分析插件会自动跟踪单页应用程序路由更改的页面视图.
详情 见文件。 。 。 .
安装
npm install analytics
npm install @analytics/simple-analytics
如何使用
这个 @analytics/simple-analytics 软件包在 浏览器。要使用、安装软件包,在您的工程中包含并初始化插件 分析。 。 。 .
以下为如何使用浏览器插件的例子.
import Analytics from 'analytics'
import simpleAnalyticsPlugin from '@analytics/simple-analytics'
const analytics = Analytics({
app: 'awesome-app',
plugins: [simpleAnalyticsPlugin()]
})
/* Track a custom event */
analytics.track('cartCheckout', {
item: 'pink socks',
price: 20
})
初始化后 analytics 与 simpleAnalyticsPlugin 插件中,数据会在任何时间或任何时间被发送到简单的分析中 分析. track 被调用.
见 其他执行实例 在您的项目中使用更多细节 .
支持的平台
这个 @analytics/simple-analytics 软件包在 浏览器
浏览器使用量
简单分析客户端浏览器插件使用这些分析的api方法:
- 分析. track - 跟踪自定义事件并发送给简单分析
浏览器 API
import Analytics from 'analytics'
import simpleAnalyticsPlugin from '@analytics/simple-analytics'
const analytics = Analytics({
app: 'awesome-app',
plugins: [simpleAnalyticsPlugin()]
})
浏览器配置选项
| 选项 | 说明 |
|---|---|
customDomain 选项 - 绳子 | 简单分析脚本的自定义域 . https://docs.simplanalytics.com/scription (中文(中国大陆) ) |
hostname 选项 - 绳子 | 允许覆盖域名 https://docs.simplanalytics.com/overwrite-domain-name 互联网档案馆的存檔,存档日期2013-12-22 |
collectDnt 选项 - 布尔 | 允许收集 DNT 访问者 https://docs.simplanalytics.com/dnt (中文(简体) ) |
mode 选项 - 绳子 | 允许散列模式 https://docs.simplanalytics.com/hash-mode 互联网档案馆的存檔,存档日期2013-12-21 |
ignorePages 选项 - 绳子 | 添加忽略页面 https://docs.simplanalytics.com/ignore-pages (中文(简体) ) |
saGlobal 选项 - 绳子 | 为事件覆盖 SA 全球 https://docs.simplanalytics.com/events#可变-sa event-is-已使用 |
autoCollect 选项 - 布尔 | 为事件覆盖 SA 全球 https://docs.simplanalytics.com/trigger-custom-page-views#use-custom-collection-anyway 互联网档案馆的存檔,存档日期2013-12-22 |
allowParams 选项 - 绳子 | 允许自定义 URL 参数 https://docs.simplanalytics.com/allow-params (中文(中国大陆) ) |
onloadCallback 选项 - 绳子 | 允许重新装入 https://docs.simplanalytics.com/trigger-custom-page-views#use-custom-collection-anyway 互联网档案馆的存檔,存档日期2013-12-22 |
其他例子
以下是其他执行实例.
在 HTML 中使用
以下是通过unpkg CDN导入的例子. 请注意,这将拉入该套件的最新版本.
<!DOCTYPE html>
<html>
<head>
<title>Using @analytics/simple-analytics in HTML</title>
<script src="https://unpkg.com/analytics/dist/analytics.min.js"></script>
<script src="https://unpkg.com/@analytics/simple-analytics/dist/@analytics/simple-analytics.min.js"></script>
<script type="text/javascript">
/* Initialize analytics */
var Analytics = _analytics.init({
app: 'my-app-name',
plugins: [simpleAnalytics()]
})
/* Track a custom event */
analytics.track('cartCheckout', {
item: 'pink socks',
price: 20
})
</script>
</head>
<body>
....
</body>
</html>
通过 ES 模块在 HTML 中使用
使用 @analytics/simple-analytics 在无害环境管理模块中.
<!DOCTYPE html>
<html>
<head>
<title>Using @analytics/simple-analytics in HTML via ESModules</title>
<script>
// Polyfill process.
// **Note**: Because `import`s are hoisted, we need a separate, prior <script> block.
window.process = window.process || { env: { NODE_ENV: 'production' } }
</script>
<script type="module">
import analytics from 'https://unpkg.com/analytics/lib/analytics.browser.es.js?module'
import simpleAnalytics from 'https://unpkg.com/@analytics/simple-analytics/lib/analytics-plugin-simple-analytics.browser.es.js?module'
/* Initialize analytics */
const Analytics = analytics({
app: 'analytics-html-demo',
debug: true,
plugins: [
simpleAnalytics()
// ... add any other third party analytics plugins
]
})
/* Track a custom event */
analytics.track('cartCheckout', {
item: 'pink socks',
price: 20
})
</script>
</head>
<body>
....
</body>
</html>