美洽怎么设置访客端聊天窗口会话迁移?
在美洽里,访客端会话迁移就是把访客的唯一标识(visitor id 或会话 id)在离开或跳转时保存起来,并在新页面或新设备上通过 SDK 或服务端接口把这些标识传回美洽,从而继续原有会话。常见做法是:在客户端用 cookie/localStorage 保存标识,或由后端保存并签发短期 token,在目标端初始化美洽时注入这些信息以恢复会话,注意跨域、隐私和安全策略。

先把事情讲清楚:什么是会话迁移,为什么要做
会话迁移听起来像个技术术语,但本质很简单——就是把“正在进行的聊天”从一个环境平滑地接到另一个环境上,让访客感到是同一次对话。举两个日常例子:你在电商网站商品页开始咨询客服,然后点“结算”跳到支付页,期望聊天窗口不丢失历史;或者客服在后台把会话从机器人切换到人工坐席时,希望访客在自己的手机端继续看到同一条聊天。
为什么要做?理由也直白:
- 用户体验一致:避免重复提交消息或重新描述问题,降低用户流失。
- 工单与历史连贯:客服能看到完整上下文,响应更迅速准确。
- 业务触达更高效:比如从营销落地页跳转到结算页仍能保留沟通,提高转化。
会话迁移的基本思路(用费曼式一句话概括)
要迁移会话,你需要三个东西:识别访客、识别会话、以及把这两者安全地从源头传到目标并让美洽把它们“认出来”。
三步法(高层流程)
- 保存:在用户离开或刷新前,把美洽分配给当前访客的唯一标识(或会话 id)保存到浏览器或后端。
- 传递:目标页面或设备启动时,把这些标识传回美洽(或通过后端调用美洽 API 恢复绑定)。
- 恢复:通过 SDK 参数或 API 把当前浏览器/设备与保存的会话/访客 id 关联,聊天窗口继续显示原有历史。
常见迁移场景与应对策略
不同场景有不同实现侧重点,我把它们分成三类,分别说明。
1. 同域多页面间迁移(最常见)
情形:网站同一域名下,用户在多个页面间跳转(如商品页→购物车→支付页)。
推荐做法:
- 让 SDK 自动持久化:美洽的 Web SDK 通常会在本域自动保存会话相关 cookie/localStorage,如果你的页面都嵌入了相同的 SDK 初始化代码,往往无需额外工作。
- 手动保存关键标识:为保险起见,可在离开页面时把访客 id、会话 id 存到 localStorage 或 sessionStorage,以便目标页面读回并初始化。
具体步骤示例(同域)
- 页面 A:当用户打开聊天或收到第一条消息,读取 SDK 提供的访客 id/会话 id(若 SDK 暴露)。
- 保存:把这些 id 存到 localStorage,例如 localStorage.setItem(‘meiqia_visitor_id’, id)。
- 页面 B:在初始化美洽 SDK 前,先读取 localStorage 里的 id,并把它传给 SDK(或调用恢复会话的 API)。
2. 跨子域 / 跨域迁移(稍复杂)
情形:从子域 A 跳到子域 B,或从一个域跳到另一个域(如域名变动或跳转到第三方支付页)。浏览器默认的同源策略会阻止 cookie 跨域共享。
两种常见策略:
- 服务端中转(推荐):在源端把访客 id 会话 id 安全地提交到后端,后端在目标域生成一个短期 token(带签名),目标域读取该 token 并调用后端接口或 SDK 把 token 换回会话。
- URL 或表单传参(谨慎使用):把会话 id 放在 URL 参数或表单中,但要注意加密/签名并避免长期暴露,尽量短期有效并只用一次。
跨域实现示例(伪代码说明)
1) 源页面:发请求到自家后端
POST /session/transfer { visitorId, conversationId, targetOrigin }
后端:生成短期 token(例如 1 分钟有效)并返回 redirect 链接
redirectUrl = https://target.example.com/landing?mq_token=xxx
2) 目标页面:读取 mq_token,调用后端校验并拿回 visitorId
GET /session/receive?mq_token=xxx -> 返回 { visitorId, conversationId }
3) 使用返回的数据初始化美洽 SDK,或调用美洽服务端 API 绑定当前 socket
3. 跨设备 / 移动 App 与网页间迁移(常见于客服转移)
情形:用户在 PC 浏览器开始会话,后来用手机继续;或客服从系统把会话转给用户的 App。
要点:
- 使用账号或访客绑定信息:如果用户有登录,直接用账号 id 作为访客 id,将会话和账号绑定,任何设备登录后都能恢复。
- 无登录时用短期 token:同跨域方案,让后端生成短期 token,发短信/扫码/链接到手机,用户点击后会话在手机上恢复。
更详细的实施步骤(从准备到上线)
前期准备
- 确认你在网站/应用中已经集成美洽 Web SDK 或相应的移动 SDK。
- 在后端准备好可以接收/颁发会话迁移 token 的接口(建议加短期失效、签名、一次性使用)。
- 明确需要迁移的“标识”:通常是 visitor id(访客唯一标识)和 conversation id(会话 id)。
具体实现细分(逐条解释)
下面我按步骤细化,越具体越能直接上手:
步骤 1:获取并保存访客/会话标识
- 从 SDK/页面拿到访客 id(如果 SDK 不直接暴露,需通过后端在首次接入时记录并返回)。
- 存储到 localStorage 或 sessionStorage(同域),如果需要跨域则发送到后端并生成短期 token。
- 示例(伪代码):
const vid = getVisitorIdFromSDK(); // 若无此函数,则由后端记录并返回 localStorage.setItem('mq_vid', vid);
步骤 2:传递标识(跨域/跨设备)
- 同域:直接读取 localStorage,无需传递。
- 跨域:源端调用后端接口生成签名 token,并 redirect 或通过短信/二维码把 token 发到目标设备或页面。
- 安全建议:token 限时、一次性、包含签名(HMAC)并通过 HTTPS 传输。
步骤 3:在目标端恢复会话
- 目标端启动时,尝试从 localStorage/cookie 或 URL 参数拿到 vid/conversationId 或 mq_token。
- 将这些信息交给美洽 SDK 或后端 API,要求美洽把当前客户端和原会话进行绑定。
- 如果 SDK 支持直接传入 visitor id,调用相应初始化方法;若不支持,先通过后端把会话/访客信息关联到当前 socket。
步骤 4:验证与回退策略
- 恢复失败时,提供回退:保留原始消息摘要并提示用户选择继续或重新发起会话。
- 在恢复成功后,做一次会话同步:把最新的消息历史拉下来显示,避免上下文缺失。
实际代码示例(伪代码,按场景说明)
下面给出几个伪代码片段,帮助把抽象步骤变成可用的实现思路。注意:美洽具体 SDK 名称或方法在不同版本会有差异,请以你们当前 SDK 文档为准。
同域页面(示例)
/* 页面 A:保存访客 id */
const visitorId = MeiqiaSDK.getVisitorId(); // 伪方法:实际以 SDK 为准
localStorage.setItem('meiqia_vid', visitorId);
/* 页面 B:初始化前恢复 */
const savedVid = localStorage.getItem('meiqia_vid');
MeiqiaSDK.init({ appId: 'xxx', visitorId: savedVid }); // 伪方法
MeiqiaSDK.openChat();
跨域通过后端 token(示例)
/* 源端:请求后端生成迁移 token */
POST /session/transfer { visitorId, conversationId, targetUrl }
-> 返回 https://target.example.com/landing?mq_token=abc123
/* 目标端加载时 */
const token = getQueryParam('mq_token');
if (token) {
// 调用自己后端换取 visitorId
fetch('/session/receive?mq_token=' + token).then(res => res.json()).then(data => {
// data = { visitorId, conversationId }
MeiqiaSDK.init({ visitorId: data.visitorId });
MeiqiaSDK.openChat();
});
}
如何用美洽的后端 API(思路,不写死接口)
美洽通常提供 REST API 来查询、创建或转移会话。核心想法是让你的后端与美洽后端交互,服务端持有可控权限,才适合做签发 token 这种敏感操作。流程大致:
- 源端把访客/会话信息 POST 给你们后端(用 HTTPS)。
- 后端调用美洽的查询会话接口获取会话详情或确认访客身份。
- 后端生成短期迁移 token(内部加密签名),并返回到源端做跳转或发短信。
- 目标端拿到 token 后,向后端换回访客/会话标识,后端再调用美洽 API 把会话绑定到目标端所在的 socket 或直接返回访客 id 给目标端 SDK 初始化。
常见问题与排查建议
- 问题:目标页面初始化后看不到历史消息
检查是否正确传入了会话 id 或访客 id,确认后端没有漏掉签名验证步骤;若使用 SDK 自动持久化,检查 cookie/localStorage 是否在跳转时被清空。 - 问题:跨域迁移失败
优先检查 token 的有效期与签名,确认目标域能调用你的后端接口,排除 CORS 问题。 - 问题:安全顾虑(id 泄露)
切忌在 URL 长期暴露敏感 id,使用短期一次性 token,传输全程使用 HTTPS,并限制 token 可被使用的来源(origin 白名单)。
实施中的细节与建议(拾遗补白)
- 会话一致性:尽量以“访客 id + 会话 id”双重确认,而不是单纯依赖一个不够稳定的值。
- 登陆用户优先策略:如果用户有站点账号,优先把会话绑定到账号,这样跨设备迁移最稳妥。
- token 设计原则:使用短期、一次性、带 HMAC 签名的 token,包含有效期与来源限定。
- 用户隐私:保存会话历史时注意合规要求(个人信息、聊天内容),按需做脱敏或审计日志管理。
- 测试覆盖:做四类测试:同域、跨子域、跨域(第三方跳转)、跨设备扫码或链接恢复。
对接美洽时的几个小贴士(实践经验)
- 先在测试环境(沙箱)反复验证迁移流程,确保 token 的回收逻辑和错误处理健全。
- 与美洽技术支持确认当前 SDK 版本对会话恢复的直接支持(有些版本会有专门的恢复方法)。
- 在迁移链路中记录操作日志(谁在什么时间发起迁移、token 是否被消费),便于排查和安全审计。
- 如果业务允许,给用户在目标页面一个明确的提示:“已为您恢复至上次会话”,减少用户疑惑。
| 迁移类型 | 推荐方法 | 风险点 |
| 同域多页 | localStorage / SDK 自动持久化 | 页面刷新/缓存策略可能清空 storage |
| 跨子域/跨域 | 后端颁发短期 token 并校验 | token 泄露、CORS、URL 暴露 |
| 跨设备 | 账号绑定或短信/扫码携 token | 认证流程复杂、用户体验断层 |
写到这里我想起一个细节:很多团队其实把“会话迁移”当成纯前端的事,但安全与跨域问题让后端介入几乎不可避免。把关键步骤放到受控的后端,不但更安全,也更容易做审计和异常回滚。嗯,好像说得有点像经验教训,但确实是实战里能省很多麻烦的方式。
如果你现在就要实施,先做这三件小事:一是确认 SDK 是否会在本域自动保存会话;二是把“迁移 token”接口设计好并支持一次性;三是把恢复流程做出明显的用户提示。按这个顺序推进,风险最小,体验提升最快。就这样,我这边的建议到这里,如果你告诉我具体是跨域还是跨设备场景,我可以把伪代码改成更贴合你当前 SDK 的示例,免得你去翻文档来回对照。