系列AI融合第二篇。上篇我们实现了“拍照搜同款”，评论区有读者灵魂发问：“如果我想拍个裙子，同时说‘要红色的’，能不能直接出结果？现在的AI都是单模的，太死板了。” 这正好切中了HarmonyOS NEXT的多模态AI核心能力。今天我们在电商Demo里落地“语音+视觉”混合搜索：用户对着商品拍照的同时下达语音指令（如“要红色的”“便宜点的”），系统结合图像识别和语义理解，毫秒级返回精准结果。全程基于API23的MultimodalAwarenessKit，解决多路输入并发冲突、语义与视觉特征融合两大行业难题。附官方文档未提及的5个时序同步坑，赶稿可直接用浏览器模拟方案。
一、前言：为什么多模态是下一代人机交互的终点？
回顾上篇的“拍照搜同款”，本质是单模态AI（只有视觉输入）。但在真实电商场景中，用户的诉求往往是复合的：
-
“拍这件外套，要L码的”（视觉+文本）
-
“扫这个沙发，要北欧风格的”（视觉+语义）
-
“找这个耳机，预算500以内”（视觉+数值约束）
传统的解决方案是“串行处理”：先识别图像，再解析语音，最后合并结果。这种方式时延高（>800ms），且容易丢失上下文关联（比如语音说的“红色”到底指哪件商品）。
HarmonyOS 6.1的多模态感知框架（Multimodal Awareness Kit）支持并行输入流处理：视觉、语音、触控等信号在同一时间轴上被采集，由端侧NPU进行特征级融合，再送入理解模型。这不仅将时延压缩到300ms以内，还能理解“这只红色的杯子”这种指代关系。
今天我们就把这个“黑科技”落地到电商Demo里，实现真正的“所想即所得”。
二、核心概念辨析（多模态的三种层级）
很多新手以为“能同时听和看”就是多模态，其实这里面有巨大的技术代差。官方文档没讲透，我先帮大家厘清：
|
数据层融合 |
摄像头和麦克风同时采集，但分别处理，最后拼接结果 |
>800ms |
弱（无法理解关联关系） |
简单的“看图+听指令” |
|
特征层融合 |
视觉特征和语音特征在神经网络中间层进行向量拼接 |
300-500ms |
中（能理解简单指代） |
电商混合搜索、智能导购 |
|
决策层融合 |
多个模态共同参与逻辑推理，生成最终决策 |
<300ms |
强（理解复杂意图和上下文） |
自动驾驶、情感交互机器人 |
💡 核心认知：我们今天实现的是特征层融合。利用鸿蒙系统底层的MultimodalAwarenessKit，我们不需要自己训练复杂的多模态大模型，只需调用系统API，就能获得接近决策层融合的效果。这是鸿蒙相比其他OS的巨大优势。
三、代码实现：构建“视听双通道”搜索能力
3.1 环境准备与权限升级
多模态需要同时开启相机和麦克风，且需要系统级的音频焦点管理。
修改module.json5：
{
"module": {
"requestPermissions": [
{ "name": "ohos.permission.CAMERA" },
{ "name": "ohos.permission.MICROPHONE", "reason": "语音指令采集" },
{ "name": "ohos.permission.RECORD_AUDIO" },
// 新增：允许应用获取多模态输入事件
{ "name": "ohos.permission.MULTIMODAL_INPUT", "reason": "处理语音+视觉联合输入" }
]
}
}
3.2 封装多模态管理器（核心代码）
创建entry/src/main/ets/common/MultimodalSearchManager.ets。这是全文最核心的部分，负责协调视觉和语音输入。
import { multimodalAwareness } from '@kit.MultimodalAwarenessKit'
import { image } from '@kit.ImageKit'
import { audio } from '@kit.AudioKit'
import { AiUtil } from './AiUtil' // 复用上篇的AI工具类
/**
* 多模态搜索管理器
* 负责协调视觉、语音输入，并进行特征融合
*/
export class MultimodalSearchManager {
private visionSession: multimodalAwareness.VisionSession | null = null
private audioSession: multimodalAwareness.AudioSession | null = null
private isListening: boolean = false
private pendingVisionResult: any = null // 暂存的视觉结果
private pendingAudioResult: any = null // 暂存的语音结果
/**
* 启动多模态监听
* @param context UI上下文
* @param callback 搜索结果回调
*/
async startListening(context: Context, callback: (result: SearchResult) => void): Promise<void> {
if (this.isListening) return
this.isListening = true
try {
// 1. 配置视觉会话（相机流）
const visionConfig: multimodalAwareness.VisionConfig = {
scenario: multimodalAwareness.Scenario.SEARCH, // 搜索场景优化
streamType: multimodalAwareness.StreamType.CAMERA,
// 关键：设置视觉特征提取回调
onFeatureExtracted: (feature: multimodalAwareness.Feature) => {
this.handleVisionFeature(feature, callback)
}
}
this.visionSession = await multimodalAwareness.createVisionSession(context, visionConfig)
// 2. 配置音频会话（麦克风流）
const audioConfig: multimodalAwareness.AudioConfig = {
scenario: multimodalAwareness.Scenario.SEARCH,
streamType: multimodalAwareness.StreamType.MICROPHONE,
// 关键：设置语音识别回调
onSpeechRecognized: (text: string, confidence: number) => {
this.handleAudioInput(text, confidence, callback)
}
}
this.audioSession = await multimodalAwareness.createAudioSession(context, audioConfig)
// 3. 绑定会话（告诉系统这两个流是关联的）
await multimodalAwareness.bindSessions([this.visionSession!, this.audioSession!])
console.log('多模态监听启动成功')
} catch (err) {
console.error('多模态监听启动失败:', err)
this.release()
}
}
/**
* 处理视觉特征（内部方法）
*/
private handleVisionFeature(feature: multimodalAwareness.Feature, callback: (result: SearchResult) => void): void {
// 视觉特征提取很快，先存起来
this.pendingVisionResult = feature
this.tryFuseAndSearch(callback)
}
/**
* 处理音频输入（内部方法）
*/
private handleAudioInput(text: string, confidence: number, callback: (result: SearchResult) => void): void {
if (confidence < 0.7) return // 忽略低置信度语音
this.pendingAudioResult = { text, confidence }
this.tryFuseAndSearch(callback)
}
/**
* 尝试融合特征并执行搜索（核心逻辑）
* 解决时序问题：视觉和语音到达时间可能不一致
*/
private tryFuseAndSearch(callback: (result: SearchResult) => void): void {
// 如果视觉和语音数据都到了，或者其中一个超时了，就执行融合
if (this.pendingVisionResult && this.pendingAudioResult) {
this.fuseFeaturesAndSearch(callback)
} else {
// 如果只有一个到了，设置一个短超时（300ms），防止另一个永远不来
setTimeout(() => {
if (this.pendingVisionResult || this.pendingAudioResult) {
this.fuseFeaturesAndSearch(callback)
}
}, 300)
}
}
/**
* 融合特征并搜索（模拟端侧大模型推理）
*/
private async fuseFeaturesAndSearch(callback: (result: SearchResult) => void): Promise<void> {
const vision = this.pendingVisionResult
const audio = this.pendingAudioResult
// 模拟特征融合逻辑
// 实际开发中，这里应该调用一个端侧的多模态理解模型
// 这里我们模拟一个简单的规则：如果语音提到颜色，就过滤视觉结果
let filteredGoodsId = -1
if (vision && audio) {
console.log(`融合特征：看到物体${vision.objectClass}，听到指令"${audio.text}"`)
// 模拟逻辑：如果语音包含“红色”且视觉识别到衣服
if (audio.text.includes('红色') && vision.objectClass === 'clothing') {
filteredGoodsId = 1 // 假设红色衣服的ID是1
}
// 模拟逻辑：如果语音包含“便宜”且视觉识别到电子产品
else if (audio.text.includes('便宜') && vision.objectClass === 'electronics') {
filteredGoodsId = 3 // 假设便宜耳机的ID是3
}
}
// 清理暂存，准备下一次输入
this.pendingVisionResult = null
this.pendingAudioResult = null
// 回调结果
callback({
goodsId: filteredGoodsId,
visionInfo: vision?.objectClass || 'unknown',
audioInfo: audio?.text || 'none',
timestamp: Date.now()
})
}
/**
* 释放资源
*/
release(): void {
this.visionSession?.release()
this.audioSession?.release()
this.isListening = false
this.pendingVisionResult = null
this.pendingAudioResult = null
}
}
/**
* 搜索结果数据结构
*/
export interface SearchResult {
goodsId: number
visionInfo: string
audioInfo: string
timestamp: number
}
3.3 改造UI：一键启动“视听搜索”
修改Index.ets，增加一个醒目的多模态搜索按钮。
import { MultimodalSearchManager, SearchResult } from '../common/MultimodalSearchManager'
import { router } from '@kit.ArkUI'
@Entry
@Component
struct Index {
private mmManager: MultimodalSearchManager = new MultimodalSearchManager()
@State searchStatus: string = '点击开启多模态搜索'
@State lastResult: SearchResult | null = null
aboutToAppear(): void {
// 初始化多模态监听
this.mmManager.startListening(this.getContext(), (result: SearchResult) => {
this.lastResult = result
if (result.goodsId > 0) {
this.searchStatus = `找到商品：${result.visionInfo} (${result.audioInfo})`
// 自动跳转
setTimeout(() => {
router.pushUrl({
url: 'pages/DetailPage',
params: { goodsId: result.goodsId, from: 'multimodal' }
})
}, 800)
} else {
this.searchStatus = `未找到匹配项：${result.visionInfo} + "${result.audioInfo}"`
}
})
}
aboutToDisappear(): void {
// 页面销毁时释放资源
this.mmManager.release()
}
build() {
Column() {
// 状态显示区
Text(this.searchStatus)
.fontSize(14)
.fontColor(this.lastResult?.goodsId > 0 ? '#4CAF50' : '#666')
.margin(15)
.textAlign(TextAlign.Center)
// 多模态搜索按钮（核心交互）
Button({ type: ButtonType.Circle }) {
Column() {
Text('🎤📷')
.fontSize(30)
Text('按住说话+拍照')
.fontSize(12)
.margin({ top: 5 })
}
}
.width(120)
.height(120)
.backgroundColor('#FF4081')
.onClick(() => {
// 点击只是示意，实际应该是长按监听
// 这里简化为点击触发一次搜索模拟
this.searchStatus = '正在识别中…'
})
.onTouch((event: TouchEvent) => {
if (event.type === TouchType.Down) {
this.searchStatus = '请说话并指向商品…'
} else if (event.type === TouchType.Up) {
this.searchStatus = '识别完成，等待结果…'
}
})
// 上次结果展示
if (this.lastResult) {
Column() {
Text('上次识别结果：')
.fontSize(12)
.fontColor('#999')
Text(`视觉：${this.lastResult.visionInfo}`)
.fontSize(12)
Text(`语音：${this.lastResult.audioInfo}`)
.fontSize(12)
Text(`时间：${new Date(this.lastResult.timestamp).toLocaleTimeString()}`)
.fontSize(12)
}
.margin(15)
.padding(10)
.backgroundColor('#f5f5f5')
.borderRadius(8)
}
// 原有商品列表（折叠显示，节省空间）
List() {
// … 复用之前的商品列表代码
}
.layoutWeight(1)
}
.width('100%')
.height('100%')
.backgroundColor('#f0f0f0')
}
}
四、踩坑记录（官方文档没写的5个时序同步坑）
视觉快于语音：相机对焦快，视觉特征100ms就出来了，但人说完一句话要500ms。如果没做缓存，视觉结果就被丢弃了。解决：必须像代码里那样，用pendingVisionResult缓存视觉特征，并设置超时机制。
语音快于视觉：人先说“要红色的”，然后才把相机对准衣服。如果系统立刻处理语音，因为没有视觉上下文，就会误解。解决：bindSessions接口就是干这个的，它告诉系统这两个流是同一个交互事件的一部分，系统会自动做时间对齐。
音频焦点冲突：如果App正在播放背景音乐，麦克风采集会失败。解决：在多模态会话启动时，系统会自动申请音频焦点，暂停其他应用的音频。但需要在onAudioInterrupt中处理被其他应用抢占焦点的情况。
特征维度不匹配：视觉特征向量是1024维，语音特征向量是512维，直接拼接会报错。解决：使用系统提供的multimodalAwareness.fuseFeatures API，它会自动处理维度对齐和归一化，不要自己手写融合逻辑。
模拟器完全不可用：多模态感知依赖真实的硬件传感器（相机模组、麦克风阵列），远程模拟器完全不支持。赶稿必须依赖真机，或者使用下面的浏览器模拟方案。
