Developer Guide
SDK 集成
Web SDK

Web SDK

Last updated April 15, 2024

Airbridge Web SDK 不仅能追踪 Web-to-app 转化数据，还能追踪 Web 应用本身的归因数据。这能让您更全面地了解链路，尤其是当您的应用同时在 Web 端和 App 上运行时。从 Web SDK 收集到的数据将汇总并显示在 Airbridge 面板上，并在该面板上提供对 Web 和 App 的综合分析。原始数据还能够以 CSV 格式导出，方便您使用。

SDK 设置

SDK 安装

使用以下 3 个选项之一来安装 SDK。

直接作为函数安装（选项 1）

在 head 元素末尾添加以下代码。

12345678
<script>
(function(a_,i_,r_,_b,_r,_i,_d,_g,_e){if(!a_[_b]){var n=function(){var c=i_.createElement(r_);c.onerror=function(){g.queue.filter(function(a){return 0<=_d.indexOf(a[0])}).forEach(function(a){a=a[1];a=a[a.length-1];"function"===typeof a&&a("error occur when load airbridge")})};c.async=1;c.src=_r;"complete"===i_.readyState?i_.head.appendChild(c):a_.addEventListener("load",function h(){a_.removeEventListener("load",h);i_.head.appendChild(c)})},g={queue:[],get isSDKEnabled(){return!1}};_i.concat(_d).forEach(function(c){var a=c.split("."),h=a.pop();a.reduce(function(p,q){return p[q]=p[q]||{}},g)[h]=function(){g.queue.push([c,arguments])}});a_[_b]=g;0<_g?(_b=new (a_.XDomainRequest||a_.XMLHttpRequest),_i=function(){},_b.open("GET",_r),_b.timeout=_g,_b.onload=function(){n()},_b.onerror=_i,_b.onprogress=_i,_b.ontimeout=_i,_b.send()):n()}})(window,document,"script","airbridge","//static.airbridge.io/sdk/latest/airbridge.min.js","init startTracking fetchResource setBanner setDownload setDownloads openDeeplink setDeeplinks sendWeb setUserAgent setUserAlias addUserAlias setMobileAppData setUserId setUserEmail setUserPhone setUserAttributes clearUser setDeviceAlias removeDeviceAlias clearDeviceAlias setDeviceIFV setDeviceIFA setDeviceGAID events.send events.signIn events.signUp events.signOut events.purchased events.addedToCart events.productDetailsViewEvent events.homeViewEvent events.productListViewEvent events.searchResultViewEvent".split(" "),["events.wait","createTouchpoint"],0);

airbridge.init({
    app: '<APP NAME>',
    webToken: '<WEB SDK TOKEN>'
});
</script>

APP NAME和 WEB SDK TOKEN 可在 Airbridge 面板 [设置]>[Tokens] 中找到。

在监测 Web-to-app 的绩效时，建议配置受保护的归因窗口。有关更多信息，请参阅本指南。

使用 NPM 模块安装（选项 2）

安装 Airbridge NPM 模块。

Shell

1
npm install airbridge-web-sdk-loader

导入 airbridge 并调用 airbridge.init 函数。

123456
import airbridge from 'airbridge-web-sdk-loader'

airbridge.init({
    app: 'App Name',
    webToken: 'Web SDK Token',
})

使用 Google Tag Manager 安装（选项 3）

请参阅使用 Google Tag Manager 安装 SDK。

支持的浏览器

Airbridge Web SDK 适用于所有支持 ES5 的浏览器。

Chrome	Firefox	Safari	Internet Explorer
✔️	✔️	✔️	IE 9 及以上版本

SDK 测试

123
button.onclick = () => {
    console.log(airbridge.isSDKEnabled)
}

前往已安装 Airbridge SDK 的网页，在开发者工具控制台中查看 airbridge.isSDKEnabled 是否为 true。

如果正确输出了结果，前往 Airbridge 面板 [原始数据]>[Web 实时记录] 确认是否显示“Open”事件。

注意
当 Web SDK 加载完毕，airbridge.isSDKEnabled 的值将从 false 变为 true。

用户设置

SDK 初始化时的用户标识符和属性设置

SDK 初始化时会自动发送用户信息。用户信息将存储在浏览器的本地存储中，并且网站上的所有后续事件都将连同用户信息一起发送，直到 signOut 被调用。

12345678910111213141516
airbridge.init({
    app: 'App Name',
    webToken: 'Web SDK Token',
    user: {
        externalUserID: 'personID',
        externalUserEmail: 'persondoe@airbridge.io',
        externalUserPhone: '1(123)123-1234',
        attributes: {
            age_group: 30,
            gender: 'Female'
        },
        alias: {
            amplitude_device_id: '83587901-2726-4E29-ACEB-A90B0F7E75F6',
        },
    }
});

属性	类型	说明
`user.externalUserID`	String	用户 ID
`user.externalUserEmail`	String	用户邮箱
`user.externalUserPhone`	String	用户电话号码
`user.attributes`	Object	自定义用户属性 (自定义键值对)
`user.alias`	Object	用户别名

用户标识符设置

使用以下方法设置自己的，而非外部的，用户标识符。用户标识符将存储在浏览器的本地存储中，并且网站上的所有后续事件都将连同用户信息一起发送，直到 signOut 被调用。

12
airbridge.setUserId('654321');
airbridge.setUserEmail('user@example.com');

您还可以设置用户别名，有助于与第三方工具（例：Amplitude、Braze）进行用户匹配。

1234567
airbridge.setUserAlias({
  "amplitude_id": "12345678",
  "braze_ext_id": "87654321"  
})

airbridge.addUserAlias("amplitude_id", "12345678")
airbridge.addUserAlias("braze_ext_id", "87654321")

用户属性设置

附加用户属性有助于更准确的多触点归因 (MTA) 分析、附加内部数据分析和集成第三方解决方案。

123456
airbridge.setUserAttributes({
    "age": 45,
    "gender": "male",
    "name": "Gildong Hong"
    // ...
});

测试

请按照以下步骤确保您设置的的用户信息正通过 SDK 正确发送。

配置用户标识符信息。
使用 SDK 发送事件。
前往 Airbridge 面板 [原始数据]>[Web 实时记录] 点击事件。
检查 user 块下的用户信息是否正确发送。

设备设置

设备别名设置

利用 Airbridge SDK 设置设备别名。即使网站关闭后，别名将保留，除非以其他方式删除。

123
airbridge.setDeviceAlias('ADD_YOUR_KEY', 'AND_YOUR_VALUE')
airbridge.removeDeviceAlias('ADD_YOUR_KEY')
airbridge.clearDeviceAlias()

方法	说明
`setDeviceAlias(key: string, value: string)`	将键值对添加到设备标识符中。
`removeDeviceAlias(key: string)`	删除对应的设备别名。
`clearDeviceAlias()`	删除所有设备别名。

注意
对于 iOS，根据 Cookie 的最大存储期限，设备别名最长可保留 7 天。

事件设置

当出现重要的用户操作时，可以发送应用内事件来监测各渠道的表现。

所有事件参数均为选填项。不过，有关事件的信息越多，越有助于提供更准确的统计数据。

自定义事件

名称: send

字段	类型	详细参数字段名称	类型	参数说明
category	String	-	-	事件名称 (必填)
info	Object	label	String	事件子属性 1
info	Object	action	String	事件子属性 2
value	Object	value	Number	自定义事件值
info	Object	semanticAttributes	Object	Semantic Event Attributes
info	Object	customAttributes	Object	Custom Event Attributes

1234567891011
airbridge.events.send("category", {
    label: "label",
    action: "action",
    value: 10,
    semanticAttributes: {
        transactionID: "transaction_123",
    },
    customAttributes: {
        key: "value",
    }
});

标准事件

查看主界面

名称	字段	类型	参数说明
homeViewEvent	-	-	-

1
airbridge.events.send('airbridge.ecommerce.home.viewed');

用户注册

字段	类型	说明
userID	String	用户 ID
userEmail	string	用户邮箱
userPhone	string	用户电话号码
attributes	object	用户属性
alias	object	用户别名

1234
airbridge.setUserId('ab180');
airbridge.setUserEmail('user@example.com');

airbridge.events.send('airbridge.user.signup');

用户登录

字段	类型	说明
userID	String	用户 ID
userEmail	String	用户邮箱
userPhone	String	用户电话号码
attributes	Object	用户属性
alias	Object	用户别名

1234
airbridge.setUserId('ab180');
airbridge.setUserEmail('user@example.com');

airbridge.events.send('airbridge.user.signin');

用户退出

名称	字段	类型	参数说明
signOut	-	-	-

123
airbridge.events.send('airbridge.user.signout');

airbridge.clearUser();

查看产品列表

字段	类型	详细参数字段名称	类型	参数说明
productListID	string	-	-	产品列表 ID
products	Array<Product>	-	-	产品数组
products	Array<Product>	productID	string	产品 ID
products	Array<Product>	name	string	产品名称
products	Array<Product>	price	number	产品价格
products	Array<Product>	currency	string	产品货币
products	Array<Product>	quantity	number	产品数量
products	Array<Product>	position	number	产品定位

123456789101112131415161718192021
airbridge.events.send('airbridge.ecommerce.productList.viewed', {
    semanticAttributes: {
        productListID: 'food',
        products: [
            {
                productID: 'coke_zero',
                name: 'Coke Zero',
                price: 1.99,
                currency: 'USD',
                position: 1
            },
            {
                productID: 'burger_cheese_double',
                name: 'Double Cheeseburger',
                price: 3.99,
                currency: 'USD',
                position: 2
            }
        ]
    }
});

查看产品详情

名称: products

类型: Array<Object>

字段	类型	参数说明
-	-	产品对象数组
productID	string	产品 ID
name	string	产品名称
price	number	产品价格
currency	string	产品货币
quantity	number	产品数量
position	number	产品定位

1234567891011
airbridge.events.send('airbridge.ecommerce.product.viewed', {
    semanticAttributes: {
        products: [{
            productID: 'coke_zero',
            name: 'Coke Zero',
            price: 1.99,
            currency: 'USD',
            position: 1
        }]
    }
});

查看搜索结果

字段	类型	详细参数字段名称	类型	参数说明
query	string	-	-	搜索查询
products	Array<Product>	-	-	产品数组
products	Array<Product>	productID	string	产品 ID
products	Array<Product>	name	string	产品名称
products	Array<Product>	price	number	产品价格
products	Array<Product>	currency	string	产品货币
products	Array<Product>	quantity	number	产品数量
products	Array<Product>	Position	number	产品定位

123456789101112131415161718192021
airbridge.events.send('airbridge.ecommerce.searchResults.viewed', {
    semanticAttributes: {
        products: [
            {
                productID: 'coke_zero',
                name: 'Coke Zero',
                price: 1.99,
                currency: 'USD',
                position: 1
            },
            {
                productID: 'burger_cheese_double',
                name: 'Double Cheeseburger',
                price: 3.99,
                currency: 'USD',
                position: 2
            }
        ],
        query: 'Search Query'
    }
});

添加到购物车

字段	类型	详细参数字段名称	类型	参数说明
cartID	string	-	-	产品购物车 ID
totalValue	number	-	-	产品总价值
currency	string	-	-	产品货币
products	Array<Product>	-	-	产品数组
productID	Array<Product>	productID	string	产品 ID
productID	Array<Product>	name	string	产品名称
productID	Array<Product>	price	number	产品价格
productID	Array<Product>	currency	string	产品货币
productID	Array<Product>	quantity	number	产品数量
productID	Array<Product>	position	number	产品定位

12345678910111213141516171819202122232425
airbridge.events.send('airbridge.ecommerce.product.addedToCart', {
    value: 13.95,
    semanticAttributes: {
        products: [
            {
                productID: 'coke_zero',
                name: 'Coke Zero',
                price: 1.99,
                currency: 'USD',
                quantity: 3,
                position: 1
            },
            {
                productID: 'burger_cheese_double',
                name: 'Double Cheeseburger',
                price: 3.99,
                currency: 'USD',
                quantity: 2,
                position: 2
            }
        ],
        cartID: '73926365',
        currency: 'USD'
    }
});

订单完成

字段	类型	详细参数字段名称	类型	参数说明
inAppPurchased	boolean	-	-	产品应用内购买
totalValue	number	-	-	产品总价值
currency	string	-	-	产品货币
transactionID	string	-	-	交易 ID
products	Array<Product>	-	-	产品数组
products	Array<Product>	productID	string	产品 ID
products	Array<Product>	name	string	产品名称
products	Array<Product>	price	number	产品价格
products	Array<Product>	currency	string	产品货币
products	Array<Product>	quantity	number	产品数量
products	Array<Product>	position	number	产品定位

1234567891011121314151617181920212223242526
airbridge.events.send('airbridge.ecommerce.order.completed', {
    value: 13.95,
    semanticAttributes: {
        products: [
            {
                productID: 'coke_zero',
                name: 'Coke Zero',
                price: 1.99,
                currency: 'USD',
                quantity: 3,
                position: 1
            },
            {
                productID: 'burger_cheese_double',
                name: 'Double Cheeseburger',
                price: 3.99,
                currency: 'USD',
                quantity: 2,
                position: 2
            }
        ],
        inAppPurchased: true,
        currency: 'USD',
        transactionID: '16874326'
    }
});

验证事件传输

请按照以下步骤确保您设置的事件正通过 SDK 正确发送。

使用 SDK 发送事件。
检查事件是否显示在 Airbridge 面板 [原始数据]>[Web 实时记录] 中。

Web-to-app 设置

Airbridge Web SDK 可让您为用户提供无缝的 Web-to-app 体验。以下方法使得开发人员不必为每个按钮单独编码，还可确保您的按钮适用于所有主流浏览器。

添加下载按钮

使用按钮的 id 值添加下载功能并追踪其性能。

12345678910111213141516171819
// html
<button id="app_download">Go to app</button>

// javascript
airbridge.setDownloads({
    buttonID: "app_download",
    // or ["app_download_1", "app_download_2", ...]
    defaultParams: {
        campaign: 'example_campaign',
        medium: 'example_medium',
        term: 'example_term',
        content: 'example_content'
    },
    ctaParams: {
        cta_param_1: '1',
        cta_param_2: '2',
        cta_param_3: '3',
    }
});

必填

buttonID: 按钮的 id 属性值。可以是数组。

选填

defaultParams: 广告系列参数

如有设置，defaultParams 将在点击按钮时发送。

注意
由于 SDK 应确保用户跳转到应用商店，因此请勿使用 <a> 标签或 onclick 功能。

添加深度链接按钮

使用按钮的 id 值嵌入深度链接并追踪其性能。通过 setDeeplinks，您可以自定义每个按钮的操作。您不仅可以为每个平台（OS）分别设置深度链接的跳转目的地，还可以覆盖后备和广告系列参数。这样即可正确追踪 Web 归因，又省去为网站上所有按钮创建深度链接的麻烦。

12345678910111213141516171819202122
airbridge.setDeeplinks({
    buttonID: "deeplinking-button-1",
    // or ["deeplink-button-1", "deeplink-button-2", ...]
    deeplinks: {
        ios: "ablog://main",
        android: "ablog://main",
        desktop: "https://www.airbridge.io/blog"
    },
    fallbacks: {
        ios: "itunes-appstore",
        // itunes-appstore(default), google-play, url
        android: "google-play"
        // google-play(default), itunes-appstore, url
    },
    defaultParams: {
        campaign: 'example_campaign',
        medium: 'example_medium',
        term: 'example_term',
        content: 'example_content'
    },
    desktopPopUp: true
});

必填

deeplinks.ios: 在 iOS 环境中点击按钮时要运行的深度链接。(仅允许具有 Scheme 的深度链接）
deeplinks.android: 在 Android 环境中点击按钮时要运行的深度链接。(仅允许具有 Scheme 的深度链接）
deeplinks.desktop: 在 Desktop 环境中点击按钮时要运行的深度链接。
fallbacks.ios: 当 iOS 中的深链接失败时的目的地。
fallbacks.android: 当 Android 中的深链接失败时的目的地。
- itunes-appstore: App 的 Apple App Store 页面
- google-play : App 的 Google Play Store 页面
- url : http 或 https scheme URL
buttonID: 按钮的 id 属性值。可以是数组。

选填

defaultParams: 广告系列参数
desktopPopUp: 如果设置为 true，在 Desktop 环境中的深度链接将在新窗口中运行。
注意：由于 SDK 应确保用户跳转到应用商店，因此请勿使用 <a> 标签或 onclick 功能。

中继页面设置

如果设置了 redirect: true，深度链接将自动运行于所有试图访问网页的传入请求。

123456789101112131415
airbridge.setDeeplinks({
    buttonID: "deeplinking-button-1",
    deeplinks: {
        ios: "example://detail?id=1",
        android: "example://detail?id=1",
        desktop: "https://example.com/detail?id=1"
    },
    fallbacks: {
        // itunes-appstore(default), google-play, url
        ios: "itunes-appstore",
        // google-play(default), itunes-appstore, url
        android: "google-play"
    },
    redirect: true
});

通过调用函数打开 App

您可以通过调用 openDeeplink 函数打开 App。

123456789101112
airbridge.openDeeplink({
    type: "redirect",
    deeplinks: {
        ios: "example://detail?id=1",
        android: "example://detail?id=1",
        desktop: "https://example.com/detail?id=1"
    },
    fallbacks: {
        ios: "itunes-appstore",
        android: "google-play"
    },
});

当调用通过用户操作执行的函数（如 onclick）时，请使用 type: "click"。当不通过用户操作直接打开 App 时，请使用 type: "redirect"。

Web-to-app 横幅

Web-to-app 横幅是鼓励 Web 用户安装 App 的横幅。

123456
airbridge.setBanner({
    title: 'AirStyle',
    description: 'Find your perfect style!!',
    keyColor: '#00a0c6',
    position: 1
});

您可以更改横幅的标题、描述、按钮颜色和其他属性。

高级设置

广告系列参数设置

如果您的广告落地页是一个网站，您可以使用几个参数为 URL 添加其他信息。这些参数可用于追踪网站的链路。

参数分析既可以自动进行，也可以手动完成。

`utmParsing` (自动)

当使用 utmParsing: true 选项调用 airbridge.init 方法时，UTM 值将自动存储为 Airbridge 广告系列参数，并可在 Airbridge 基础报告中查看。

URL 参数	Airbridge 广告系列参数
utm_source	Channel (`channel`)
utm_campaign	Campaign (`campaign`)
utm_medium	Sub Publisher (`sub_id`)
utm_term	Term (`term`)
utm_content	Content (`content`)

如果缺少 utm_source，则无法解析其他 UTM 参数。

12345
airbridge.init({
    app: 'App Name',
    webToken: 'Web SDK Token',
    utmParsing: true
});

URL 是 window.location.href 值。

urlQueryMapping (自动)

当使用 utmParsing: true 选项调用 init 方法时，UTM 值将自动存储为 Airbridge 广告系列参数，并可在 Airbridge 基础报告中查看。

您可以使用 urlQueryMapping 自动存储其他参数。在调用 airbridge.init 方法时，为 urlQueryMapping 插入键值对。以下是在 Airbridge 可以使用的键。

参数名称	说明
channel	渠道
campaign	广告系列
ad_group	广告组
ad_creative	广告素材
content	内容
term	关键词
sub_id	子渠道
sub_id_1	二级子渠道 1
sub_id_2	二级子渠道 2
sub_id_3	二级子渠道 3
campaign_id	广告系列 ID
ad_group_id	广告组 ID
ad_creative_id	广告素材 ID
term_id	关键词 ID

如果在 utm_source 和 utm_campaign 中使用了 internal_code 等自定义参数，URL 结构将如下所示。

https://example.com/?utm_source=google&utm_campaign=jan_ua_campaign&internal_code=ABC

以下是一个示例，说明如何映射各参数，使其显示在 Airbridge 面板上。

123456789
airbridge.init({
    app: 'App Name',
    webToken: 'Web SDK Token',
    urlQueryMapping: {
      channel: 'utm_source',
      campaign: 'utm_campaign', 
      sub_id_1: 'internal_code'
    }
});

如果通过上述 URL 发生转化，则 internal_code 的数据可通过前往 Airbridge 面板 [基础报告]>[配置]>[分组] 选择"Sub Sub Publisher 1”访问。

手动功能

以下是一个示例，说明如何手动解析参数。
从 params 对象中提取信息，并在调用 init 函数时注册此信息。

1234567891011121314151617181920212223242526272829303132

function queryStringToJSON(url) {
    if (url.search.slice !== undefined) {
        var pairs = url.search.slice(1).split('&');
    } else {
        var pairs = url.split('?')[1].split('&');
    }

    var result = {};
    pairs.forEach(function(pair) {
        pair = pair.split('=');
        result[pair[0]] = decodeURIComponent(pair[1] || '');
    });

    return JSON.parse(JSON.stringify(result));
}

var url = window.location.href;
var params = queryStringToJSON(url);

// initialize
airbridge.init({
    app: 'App Name',
    webToken: 'Web Token',
    defaultChannel: params['utm_source'],
    defaultParams: {
        campaign: params['utm_campaign'],
        medium: params['utm_medium'],
        content: params['utm_content'],
        term: params['utm_term']
    }
});

名称	说明
defaultChannel	要记录在网页上所有事件中的广告主名称
defaultParams.campaign	要记录在网页上所有事件中的广告系列名称
defaultParams.medium	要记录在网页上所有事件中的广告媒体
defaultParams.content	要记录在网页上所有事件中的广告内容
defaultParams.term	要记录在网页上所有事件的广告关键词。

清除用户信息

使用 clearUser 方法删除用户的 ID、邮箱、电话号码、别名和属性。

1
JavaScriptairbridge.clearUser()

加密用户信息

在客户端级别对 user.externalUserEmail 和 user.externalUserPhone 进行哈希处理 (SHA256)。此选项不会影响 user.externalUserID，也不会对其进行哈希处理。

123456
airbridge.init({
    app: 'App Name',
    webToken: 'Web Token',
    userHash: true, // Default false
    // ...
});

延迟事件传输

如果在事件完全发送之前发生跳转（例如从中继页面发送事件），数据可能会丢失。使用 events.wait 可确保事件在跳转之前发送完毕。

参数	类型	说明
timeout	Number	最长等待时间（毫秒）
callback	(error: string) => void	事件发送时的回调

12345678910
airbridge.init({
    app: 'App Name',
    webToken: 'Web Token',
});

airbridge.events.send('category');

airbridge.events.wait(3000, function (error) {
    location.href = 'url';
});

归因窗口设置

使用 cookieWindow 调整归因窗口。

12345678910111213
// Set attribution window to 1 day
airbridge.init({
    app: 'App Name',
    webToken: 'Web Token',
    cookieWindow: 1
});

// Set attribution window to 720 minutes (12 hours)
airbridge.init({
    app: 'App Name',
    webToken: 'Web Token',
    cookieWindowInMinutes: 720
});

如果同时设置了 cookieWindow 和 cookieWindowInMinutes，则适用cookieWindowInMinutes。

用户追踪是通过浏览器 Cookie 进行的，这些 Cookie 在子域之间分享。

将 shareCookieSubdomain 设置为 false 可停止在子域之间分享 Cookie。

123456
// initialize 
airbridge.init({ 
    app: 'App Name',
    webToken: 'Web Token',
    shareCookieSubdomain: false
});

shareCookieSubdomain 的默认值为 true。

如果有一项服务使用多个子域，建议设置为 true。
如果有多项服务使用多个子域，建议设置为 false。

示例

广告系列 A 的追踪链接 → https://airbridge.io → https://blog.airbridge.io,

shareCookieSubdomain: true
- https://airbridge.io 上的事件 → 归因于 广告系列 A
- https://blog.airbridge.io 上的事件 → 归因于 广告系列 A
shareCookieSubdomain: false
- https://airbridge.io 上的事件→ 归因于 广告系列 A
- http://blog.airbridge.io 上的事件 → 归因于 默认广告系列

个人信息保护

如果在初始化 SDK 时将 autoStartTrackingEnabled 设置为 false，则在调用 airbridge.startTracking 之前不会发送事件。

1234567
airbridge.init({
    app: 'App Name',
    webToken: 'Web Token',
    autoStartTrackingEnabled: false,
});

airbridge.startTracking()

autoStartTrackingEnabled 的默认值为 true。

受保护的归因窗口

注意
若您希望在 CTA 按钮中嵌入自定义渠道追踪链接，则不可使用 setDeeplinks 函数。相反，若您使用 setDeeplinks 函数创建 CTA 按钮，则不可向其嵌入自定义渠道追踪链接。

如果您正在通过使用 setDeeplinks 函数创建的 CTA 按钮（例：一个标有“在应用中查看”的按钮）实现 Web-to-app 追踪，您可以根据需要配置受保护的归因窗口（Protected Attribution Window, PAW）。

PAW 是从网站启动开始，从归因过程中排除由 Airbridge Web SDK 收集的触点的时间范围。更多有关 PAW 设置下的归因过程，请参阅本指南。

useProtectedAttributionWindow 的默认值为 30 分钟。若需修改，请在 airbridge.init() 中将 useProtectedAttributionWindow 设置为 true，并输入您所希望的 PAW（以分钟为单位）。useProtectedAttributionWindow 可以设置为最多 4320（3 天）。

若您不希望使用 PAW，请将 useProtectedAttributionWindow 设置为 false。

1234567
airbridge.init({
    app: 'App Name',
    webToken: 'Web Token',
    // ...
    useProtectedAttributionWindow: true,
    protectedAttributionWindowInMinutes: 60
});

追踪对另一个网站的链路

当用户跳转到另一个网站时，使用 sendWeb 方法。如果用户跳转到已安装 Airbridge Web SDK 的网站，Airbridge 可连接归因进行分析。

为了连接归因，在初始化 Airbridge SDK 时，必须将 useProtectedAttributionWindow 设置为 true。请参阅受保护的归因窗口。

1234567
// Open in same window
airbridge.sendWeb("https://www.airbridge.io/blog")

// Open in new window
airbridge.sendWeb("https://www.airbridge.io/blog", function(err, res) {
  window.open(res.targetUrl)
})

使用 Google Tag Manager

可使用 Google Tag Manager 安装 Airbridge SDK。

SDK 安装

请按照以下步骤使用 Google Tag Manager 安装 Airbridge SDK。

点击“Workspace overview” 中的“New tag”，或在 “Container”中选择“Tag → New”。
在“Tag configuration → Custom settings”中选择“Custom HTML”。
在“HTML”部分插入 Airbridge SDK 代码，如下图所示。
前往“Tag configuration → Advanced settings → Tag firing priority”并输入一个大于 0 的数字（例： 9999）。
在“Tag configuration → Advanced settings → Tag firing options”中选择“Once per page”。
将“Trigger”设置为“Pageview - DOM ready”。
完成创建并提交。
在 Airbridge 面板的实时记录检查 SDK 记录是否记录正确。

事件追踪

请按照以下步骤使用 Google Tag Manager 追踪事件。

点击“Workspace overview” 中的“New tag”，或在 “Container”中选择“Tag → New”。
在“Tag configuration → Custom settings”中选择“Custom HTML”。
在“HTML”部分插入您希望追踪的事件代码，如下图所示。
根据事件，在“Advanced settings → Tag firing options” 中选择 “Unlimited”、“Once per event”、或 “Once per page”。
为事件设置适当的“Trigger”。
完成创建并提交。
在 Airbridge 面板的实时记录检查 SDK 记录是否记录正确。

Was this page helpful?

Have any questions or suggestions?

Web SDKself.__wrap_n!=1&&self.__wrap_b(":R29jtt7ppjtsba:",0.5)

SDK 设置

SDK 安装

直接作为函数安装（选项 1）

使用 NPM 模块安装（选项 2）

使用 Google Tag Manager 安装（选项 3）

支持的浏览器

SDK 测试

注意

用户设置

SDK 初始化时的用户标识符和属性设置

用户标识符设置

用户属性设置

测试

设备设置

设备别名设置

注意

事件设置

自定义事件

标准事件

查看主界面

用户注册

用户登录

用户退出

查看产品列表

查看产品详情

查看搜索结果

添加到购物车

订单完成

验证事件传输

Web-to-app 设置

添加下载按钮

注意

添加深度链接按钮

中继页面设置

通过调用函数打开 App

Web-to-app 横幅

高级设置

广告系列参数设置

utmParsing (自动)

清除用户信息

加密用户信息

延迟事件传输

归因窗口设置

Cookie 分享选项

个人信息保护

受保护的归因窗口

注意

追踪对另一个网站的链路

使用 Google Tag Manager

Web SDK

SDK 测试

`utmParsing` (自动)