百度一镜数字人关联产品链接并不是简单地把URL贴在视频下方,而是通过时间轴锚点、话术触发词和播放器事件协同完成。数字人在口播时命中预设关键词,播放器向页面抛出商品事件,前端组件接收后展示商品卡片或直接跳转。这样做的好处是,一条数字人视频可以同时承担产品介绍、卖点讲解和成交转化三种任务。

一、自动讲解与链接关联的实现机制
百度一镜数字人的自动讲解通常依赖两条数据轨道。第一条是语音轨道,由数字人按照脚本朗读;第二条是商品锚点轨道,记录某个SKU在什么时间点出现、关联哪个链接、使用什么卡片样式。播放到锚点时间时,播放器会触发 product-anchor 事件。页面上的监听函数读取事件中的商品参数,再决定是弹出橱窗、更新购物车按钮还是直接打开商品详情页。
这种机制的核心是关键词与时间轴的配合。比如话术中说到“这款降噪耳机支持40小时续航”,配置系统会在“降噪耳机”这个词出现的位置打一个商品锚点。数字人实际播放到这里时,不论用户是否点击屏幕,右侧商品卡片都会自动切换。更进一步,如果开启自动讲解模式,系统会按脚本顺序依次播报每个关联产品的卖点,并在每个产品介绍开始时触发对应链接。
平台端的可视化配置适合运营人员快速上线,而接口方式更适合批量维护SKU较多的场景。两者最终都会生成一个带 productList 的播放配置对象,播放器根据这个配置完成自动讲解。
二、平台端配置产品链接的详细步骤
在百度智能云一镜数字人控制台创建完数字人形象和话术脚本后,进入商品关联模块。先维护商品库,每个商品至少需要SKU编码、商品名称、详情链接和封面图。链接建议使用全路径,避免相对路径在App内或小程序环境中无法跳转。若链接域名不在白名单中,发布前需要先到应用设置中添加业务域名,否则卡片可能被拦截。
接下来在时间轴编辑器中勾选“开启商品锚点”。选中需要关联的段落,设置触发词和触发时间。触发词可以从脚本中自动提取,也可以手动补充同义词。比如脚本中出现“音箱”“智能音箱”“这款音箱”,不应只配一个词,否则数字人念到同义表达时会漏触发。配置完成后点击预览,通过调试面板观察事件是否按预期抛出。
| 配置项 | 作用 | 建议值 |
|---|---|---|
| 触发词 | 命中后展示商品 | 脚本中实际出现的词 |
| 锚点时间 | 精确到秒的展示时机 | 比语音提前0.3秒 |
| 跳转链接 | 商品详情页地址 | HTTPS全路径 |
| 卡片样式 | 右下角或居中弹出 | 移动端右下角 |
保存后发布,系统会生成一段播放配置。发布前务必在不同机型测试,尤其是iOS WKWebView和Android WebView对自动跳转策略不一样。iOS会限制未经用户手势的 window.open,自动跳转建议改为在页面内弹窗或使用H5路由,而不要直接打开新窗口。
三、使用接口动态关联并监听事件
如果商品量很大,或者在自有商城后台已经维护了商品数据,不建议在数字人平台手工重复录入。可以调用百度一镜数字人的数据同步接口,把本地商品库映射到数字人项目。接口一般接受 videoId、productList 和 triggerMode。triggerMode 设为 auto 时,数字人会按商品顺序自动讲解;设为 manual 时只在用户点击卡片后讲解。
下面是一段前端播放器监听示例,展示如何根据锚点事件渲染商品卡片。注意事件回调中拿到的 link 要再次校验域名,避免被恶意注入非法地址。
const player = new BaiduDigitalHumanPlayer({
container: document.getElementById("player"),
videoId: "digtal_human_001"
});
const productList = [
{
sku: "A1001",
name: "便携榨汁杯",
link: "https://ipipp.com/product/A1001",
triggerWord: "榨汁杯"
},
{
sku: "A1002",
name: "降噪耳机",
link: "https://ipipp.com/product/A1002",
triggerWord: "耳机"
}
];
player.on("product-anchor", (payload) => {
const product = productList.find((item) => item.sku === payload.sku);
if (!product) {
return;
}
renderProductCard(product);
});
自动讲解还有一种更轻量的实现方式,即服务端直接返回带时间戳的商品序列。播放器在初始化时拉取配置,内部定时器到点触发。这种方式不需要依赖语音识别,适合商品数量固定、话术不频繁改动的场景。
{
"videoId": "digtal_human_001",
"triggerMode": "auto",
"products": [
{
"sku": "A1001",
"name": "便携榨汁杯",
"link": "https://ipipp.com/product/A1001",
"triggerTime": 12.5,
"triggerWord": "榨汁杯",
"cardStyle": "bottom-right"
},
{
"sku": "A1002",
"name": "降噪耳机",
"link": "https://ipipp.com/product/A1002",
"triggerTime": 28.0,
"triggerWord": "耳机",
"cardStyle": "bottom-right"
}
]
}
四、常见问题与排查思路
自动讲解不触发,最常见的原因是触发词没有精确命中。数字人语音合成后的读法可能与脚本文本不完全一致,例如“SKU”被读成字母“S-K-U”,而配置里写的是英文单词“sku”。排查时可以先在调试面板查看命中的文本,再把同音词、同义词一并加入触发列表。
链接跳转失败多与业务域名白名单或签名有关。H5页面里可以使用 location.href 直接跳转,但在小程序WebView中需要走小程序跳转协议。若使用自定义协议,如 digitalhuman://product?sku=A1001,要在原生端提前注册Scheme,否则会提示无法打开页面。URL中的中文参数必须先用 encodeURIComponent 处理,避免参数截断。
自动讲解和手动讲解可以共存,但不要在同一时间段绑定多个商品。多个锚点重叠会使播放器频繁抛出事件,页面端如果来不及渲染,会出现卡片闪烁。建议商品锚点之间至少间隔5秒,并给卡片切换增加短动画,避免视觉跳动。