UniApp跨平台自定义消息语音播报实战指南

1. 为什么需要自定义消息语音播报在移动应用开发中消息推送是提升用户活跃度和留存率的重要手段。但普通的文字通知往往容易被用户忽略特别是在商户收款、物流提醒、重要事件通知等场景下语音播报能够更直接有效地触达用户。举个例子我去年给一个生鲜超市开发收款系统时就遇到过这个问题。店员反映在忙碌时经常错过手机推送的订单通知导致顾客等待时间过长。后来我们给APP加上了语音播报功能每当有新订单时就会自动播放新订单3斤苹果2箱牛奶店员在5米外都能听到大大提高了接单效率。UniApp作为跨平台开发框架要实现Android和iOS双端的语音播报功能需要解决几个核心问题平台差异iOS和Android的推送机制、音频播放接口完全不同离线推送应用被杀死或退到后台时如何保证语音正常播放厂商适配不同安卓厂商对后台进程的限制策略各异性能优化避免频繁播报导致的内存泄漏和卡顿2. 基础环境准备2.1 UniPush服务开通首先需要在UniApp项目中开通UniPush服务。这里有个坑要注意如果你需要用自己的服务器发送推送消息必须使用UniPush 1.0版本因为2.0版本目前只支持通过UniApp后台发送消息。开通步骤在HBuilderX中打开manifest.json文件找到App模块配置选项卡勾选Push(消息推送)下的UniPush点击右侧的配置按钮按照指引完成服务开通2.2 原生插件集成要实现自定义语音播报我们需要使用DCloud官方提供的两个插件DCloud-PushSound插件用于设置自定义推送铃声DCloud-TTS插件用于动态文本转语音播报安装方法// 在manifest.json的App原生插件配置中添加 { nativePlugins: [ { type: module, name: DCloud-PushSound, version: 1.0.2 }, { type: module, name: DCloud-TTS, version: 1.0.0 } ] }2.3 音频资源准备对于固定语音提示如新订单提醒需要提前准备好音频文件并放到指定目录iOS必须是.caf格式放在nativeplugins/DCloud-PushSound/ios/目录下Android支持.mp3/.wav格式放在nativeplugins/DCloud-PushSound/android/res/raw/目录下可以使用以下命令将其他格式转换为iOS需要的caf格式afconvert input.mp3 output.caf -d ima4 -f caff -v3. 实现固定语音提示3.1 Android端配置Android 8.0以上版本需要使用通知渠道来设置自定义铃声。以下是完整配置示例const plugin uni.requireNativePlugin(DCloud-PushSound); plugin.setCustomPushChannel({ soundName: order_alert, // 对应raw目录下的order_alert.mp3 channelId: order_channel, channelDesc: 订单通知渠道, enableLights: true, // 开启呼吸灯 enableVibration: true, // 开启震动 importance: 4, // 高优先级 lockscreenVisibility: 1 // 锁屏可见 });重要提示Android的通知渠道一旦创建就无法修改配置。如果需要更改铃声必须使用新的channelId重新创建渠道。3.2 iOS端配置iOS的配置相对简单但需要注意音频文件必须放在正确位置if (plus.os.name iOS) { setCustomPushChannel({ soundName: order_alert, // 对应order_alert.caf文件 channelId: order_channel, channelDesc: 订单通知渠道 }); }3.3 服务端推送配置以PHP为例发送推送时需要指定sound参数$payload [ title 新订单, content 您有新的生鲜订单, sound order_alert.caf, // iOS android [ sound order_alert // Android ] ];4. 实现动态语音播报对于需要根据推送内容动态播报的场景如支付宝收款100元需要使用TTS文本转语音技术。4.1 TTS插件初始化首先初始化语音引擎const tts uni.requireNativePlugin(DCloud-TTS); // Android需要设置语音包 tts.initEngine({ appid: 你的百度语音APPID, // 或使用系统自带引擎 appkey: 你的百度语音APPKEY, secret: 你的百度语音SECRET }, (res) { console.log(初始化结果:, res); });4.2 接收透传消息处理在App.vue中监听推送消息onLaunch: function() { plus.push.addEventListener(receive, (msg) { if (msg.payload) { const data JSON.parse(msg.payload); this.playVoice(data.content); // 播放语音 } }); }, methods: { playVoice(text) { tts.speak({ text: text, speed: 5, // 语速1-9 pitch: 5, // 音调1-9 volume: 15 // 音量0-15 }, (res) { console.log(播放完成, res); }); } }4.3 离线推送处理方案应用被杀死时无法直接播放语音可以采用以下方案厂商通道特殊铃声通过各厂商通道发送特定铃声标识后台服务唤醒Android可以启动前台服务保持运行本地通知语音文件下载预生成的语音文件后播放以华为厂商通道为例// 华为推送payload示例 $huaweiPayload [ notification [ title 收款通知, body 支付宝收款100元, sound receipt_100 // 对应预置的音频文件 ] ];5. 厂商适配与性能优化5.1 主流厂商适配指南厂商关键配置注意事项华为申请自分类权益必须安装华为移动服务小米控制台配置渠道每天最多5条运营消息OPPOColorOS 3.1默认关闭通知权限vivo需应用上架文案不能含test等词5.2 常见问题解决方案问题1华为手机后台收不到推送解决方案引导用户设置允许后台活动问题2iOS语音播放被中断解决方案配置AVAudioSession为播放模式plus.ios.import(AVFoundation).AVAudioSession.sharedInstance() .setCategoryError(AVAudioSessionCategoryPlayback);问题3Android 8.0铃声不生效解决方案确保每次修改铃声都使用新的channelId5.3 性能优化建议音频预加载常用语音提前加载到内存消息去重相同内容10秒内不重复播报音量自适应根据环境噪音动态调整音量资源释放长时间不用时释放TTS引擎// 音频预加载示例 const preloadAudio [welcome, goodbye]; preloadAudio.forEach(name { tts.preload({text: name}); });6. 完整实现示例下面是一个收款语音播报的完整代码示例首先在manifest.json中配置插件和权限创建语音播放工具类voice.jsconst tts uni.requireNativePlugin(DCloud-TTS); const pushSound uni.requireNativePlugin(DCloud-PushSound); let isPlaying false; const queue []; export default { init() { // 初始化TTS引擎 tts.initEngine({ mode: online // 使用在线引擎更自然 }); // 设置Android通知渠道 if (plus.os.name ! iOS) { pushSound.setCustomPushChannel({ channelId: voice_channel, channelDesc: 语音播报通道 }); } }, play(text) { if (isPlaying) { queue.push(text); return; } isPlaying true; tts.speak({ text: text, speed: 5 }, () { isPlaying false; if (queue.length) { this.play(queue.shift()); } }); } }在App.vue中使用import voice from ./utils/voice; export default { onLaunch() { voice.init(); plus.push.addEventListener(receive, (msg) { if (msg.payload) { const data JSON.parse(msg.payload); if (data.type payment) { voice.play(支付宝收款${data.amount}元); } } }); } }7. 实际项目经验分享在最近一个社区团购项目中我们实现了以下语音播报场景新订单新订单12栋302需要3斤排骨到货通知您购买的草莓已到自提点系统提醒今日23点将截止下单踩过的一些坑值得分享音频格式问题最初iOS使用.mp3文件导致音量过小转成.caf后正常华为保活部分华为机型需要单独引导用户设置后台权限语速控制老年人居多的社区需要将语速降到3级多语言支持双语社区需要根据用户设置切换中英文播报一个实用的调试技巧是在开发时添加测试按钮button clickvoice.play(测试语音123)测试播报/button对于需要更高定制化的项目可以考虑以下扩展方向语音模板支持动态变量插入如您好{name}您的订单{code}已发货情绪控制通过参数控制高兴、紧急等不同语气离线语音包提前下载常用语音避免网络依赖3D音效使用WebAudio API实现空间音效最后提醒一点语音播报功能一定要提供关闭开关尊重用户选择。我们发现在安静场合如会议室很多用户会临时关闭语音提示。