美洽获取页面参数的核心就是把页面上的关键信息（URL、query、utm、商品ID、用户行为等）在合适的时机通过美洽前端/SDK接口或后台埋点传给会话，以便客服、机器人和后台规则能识别用户来源、当前操作和上下文，从而实现精准分配、知识库召回和自动化触发。通常做法是：在页面加载或关键动作（如加入购物车、下单页、点击咨询）触发 MQ 的初始化、设置访客信息或发送自定义属性，把信息放到 extra/customData/props 里；同时注意隐私合规与字段加密。
先弄清楚“页面参数”到底指什么
说白了，页面参数就是任何能描述用户当前页面和操作的结构化信息。把它看成是一张“名片+现场录像”——既有用户是谁，也有他在页面上做了什么。
- 基础上下文：当前 URL、referrer、页面标题。
- 查询参数：query string（如 utm_source、campaign、ref、sku、item_id 等）。
- 用户态信息：登录后用户ID、手机号、会员等级、历史订单ID。
- 行为信息：点击、加入购物车、浏览过的商品列表、停留时长。
- 自定义字段：企业特有的标签（比如客户分组、推广素材ID、A/B 测试分组）。
为什么要把这些参数传给美洽？
目的很简单：让客服和机器人“知道来访者在干嘛、从哪来、值不值钱”。没有上下文，一切都像盲聊。
- 提升响应效率：客服打开会话就知道订单号或商品，省去反复问询。
- 实现智能路由：根据渠道、地域或用户等级把会话分配给不同团队。
- 触发自动化：基于参数触发机器人提问、优惠券下发或工单创建。
- 数据分析与归因：把会话与营销活动、转化路径关联起来，便于优化。
具体怎么传：常用的四种方式（按最佳实践）
下面我把常见方式讲清楚、分步骤说，像在白板上解释一样——先目标、再方式、再例子。
1. 页面初始化时传（适用于初次识别访客）
场景：用户打开网页需要立即关联渠道、session 或用户 ID。通常放在页面头部初始化 SDK 的时候传入。
- 时机：页面 load 或 SPA 路由首次进入时。
- 接口：美洽 Web SDK 的初始化或 setUserInfo/visitorProfile（具体命名请参照当期 SDK 文档）。
- 适合传的字段：utm 系列、referrer、visitor_id、初次来源。
2. 点击或关键动作时传（适用于行为触发）
场景：用户点击“咨询客服”按钮、加入购物车或到达支付页时需要把当下的商品信息或订单号同步过去。
- 时机：按钮点击、表单提交、进入结算页等。
- 接口：调用 MQ.enter、sendMessage 或 SDK 的 customProps/extra 字段推送。
- 适合传的字段：sku、item_id、cart_total、order_id、coupon_code。
3. 通过埋点系统或数据层统一传（适用于团队协作）
场景：大型项目中，前端、数据、营销团队希望用同一套 dataLayer 或埋点规范把信息统一上报。
- 优势：结构化、复用性高，便于 QA 与统计。
- 做法：把关键字段放到 window.dataLayer 或自定义对象，SDK 在需要时读取并发送。
4. 后台关联推送（适用于服务端已掌握信息）
场景：用户在登录状态下，后端能获取更多敏感或历史数据（如消费能力、订单详情），可以在会话创建或更新时由后台接口向美洽推送。
- 优点：无需在前端暴露敏感信息，便于做加密和合规控制。
- 注意：需保证接口鉴权与数据加密，避免泄露。
常见代码示例（概念性伪代码，按 Feynman 法则把步骤拆开）
先说“为什么这样写”：初始化拿到访客识别、点击时补充上下文、后台则用于敏感数据。下面只是示意，按你们的 SDK 方法名替换即可。
/* 页面初始化：关联utm与visitorId */
MQ.init({visitorId: getCookie('vk')});
MQ.setVisitorInfo({
url: window.location.href,
utm_source: getQuery('utm_source'),
referrer: document.referrer
});
/* 用户点击咨询：传商品与订单信息 */
document.getElementById('askBtn').addEventListener('click', function(){
MQ.openChat({
customData: {
page: 'product',
sku: currentSku,
price: currentPrice,
cartCount: getCartCount()
}
});
});
/* 后端同步（更安全的敏感字段） */
POST /meiqia/api/updateVisitor
{
visitorId: 'xxx',
vipLevel: 3,
lastOrderId: 'ORD12345' // 服务器直接调用美洽服务端 API 推送
}
在不同站点类型上的差异与注意点
- 多页面网站（传统）：页面刷新时重新初始化 SDK，注意保持 visitorId（cookie/localStorage）。
- 单页应用（SPA）：路由变化不会刷新 JS，全靠路由钩子把 page 参数重新推送到美洽。
- 移动 H5：与原生交互时可通过 JSBridge 传参，注意 UA 与 webview 特有的 referrer 问题。
- 原生 App / 小程序：使用美洽对应的移动 SDK，把 native 拿到的用户信息透传给会话。
如何在会话端查看与利用这些参数
把参数传上去只是第一步，关键是前端、客服端和自动化规则怎么用它们。
- 在客服工作台显示：多数工作台会把 visitor 的 customFields/extra 显示在侧边栏，方便一键查看。
- 机器人触发：机器人可以读取会话上下文来决定问答流程，比如检测到 order_id 就直接查询订单状态。
- 工单与标签：可根据参数自动打标签（如“来自广告A”），便于后续分群与复购策略。
- 工单内容模板：在客服回复中可以使用占位符嵌入参数（如{{order_id}}）。
常见业务场景与示例参数映射
举几个典型例子，说明实际如何映射字段。
- 营销归因：utm_source → marketing_channel；utm_campaign → campaign_id；ad_id → creative_id。
- 销售支撑：sku、price、cart_total → 快速检索商品页面和下单凭证。
- 客服优先级：vip_level、last_order_amount → 自动优先分配给高价值客户组。
- 购物车唤回：cart_items → 机器人提示“您未结算的商品”，并提供链接。
一个简单表格：常用方法对照（帮助你快速选方案）
| 方法 | 何时用 | 参数位置 | 优缺点 |
| 初始化（init / setUserInfo） | 页面首次加载，建立访客识别 | visitor.profile / initArgs | 快速关联来源；但不适合后续行为更新 |
| 点击/打开会话（open/enter） | 交互触发时补充上下文 | customData / extra | 实时、灵活；需要在关键点加埋点 |
| 后台推送（Server API） | 敏感信息或批量更新 | 服务端 API 字段 | 安全、可控；实现稍复杂 |
| 埋点数据层（dataLayer） | 和分析/埋点统一管理 | window.dataLayer / 全局对象 | 结构化、便于 QA；需前后端约定 |
隐私与合规：别把敏感数据当作“方便”随手扔过去
这部分很重要，常被忽略。简单规则：
- 不传明文密码、支付卡号或完整身份证号码。
- 必要时对 PII 做脱敏或加密，再传给美洽；或使用服务端推送避免前端暴露。
- 遵守地区法规（如 GDPR、CCPA），在收集和传输前征得用户同意并做好记录。
- 定期清理不再需要的会话字段，减少长期数据滞留风险。
排查与验证步骤（实操派必看）
传参出问题大部分是时机不对或字段命名不一致。按这个步骤一项项排查：
- 1) 控制台打印：在发送前 console.log 参数，确认值正确。
- 2) 网络请求：用浏览器 DevTools 看 SDK 发出的请求体，确认字段是否到达美洽。
- 3) 会话端检查：在客服工作台查看侧边栏是否展示期望字段。
- 4) 模拟多场景：匿名用户、已登录用户、跨域打开、SPA 切换都要测试。
- 5) 回归埋点规范：如果有 dataLayer，确认字段名与团队约定一致。
一些容易犯的错误（顺便提醒一下）
- 字段命名不统一：前端叫 utm_source，客服端看的是 channel，这就不能映射。
- 时机错了：SPA 路由变化没推送，客服看到的是旧页面信息。
- 把敏感信息放在 querystring：会被日志、referrer 泄露。
- 依赖第三方脚本顺序：SDK 载入顺序导致初始化时拿不到需要的 dataLayer。
收尾时的一点随想（比较生活化）
其实把页面参数传好，最重要的是形成“人、页、事”三个维度之间的闭环——谁（who），在哪（where），在做什么（what）。把这三者打通，客服从被动问问题变成主动解决问题。照着上面的步骤去做，别怕一点点麻烦，先搭好数据通道，再慢慢优化字段与规则；遇到兼容或隐私问题，先停一停想想最稳妥的实现方式。写到这儿我也想起过往做埋点的坑，改一改参数名称、调几次网络，反而更踏实。希望这份说明能帮你把美洽的页面参数用起来顺手一些。