uni-app怎么实现App端内的语音合成播报 uni-app调用系统声音接口【技巧】

冬杰小哥_9165

冬杰小哥_9165

2026-04-04

462人浏览

原创

App端语音合成必须用plus.audio.createSpeech,因uni.getBackgroundAudioManager不支持TTS;需在plus.ready后调用,指定lang: 'zh-CN',并处理Android厂商引擎差异。

uni-app怎么实现app端内的语音合成播报 uni-app调用系统声音接口【技巧】

uni-app App端语音合成用 plus.audio.createSpeech 而不是 uni.getBackgroundAudioManager

App端(iOS/Android)的语音播报必须走原生层,uni.getBackgroundAudioManager 是为背景音频设计的,不支持 TTS(文本转语音),强行用会静音或报错 errCode: 1001。真正能用的是 plus.audio.createSpeech —— 这是 uni-app 封装的 5+ Runtime 原生语音合成接口,仅在 App 环境下可用。

常见错误现象:
• 调用 uni.createInnerAudioContext() 播放 base64 音频失败(TTS 不生成音频文件)
• H5 或小程序里能跑的语音逻辑,在 App 端完全没声音
• 控制台无报错但 onStart 不触发,其实是 createSpeech 初始化失败没 catch

  • 只在 App 环境生效:需用 uni.getSystemInfoSync().platform === 'app' 包裹调用
  • 必须等 plus.ready 触发后才能用,否则 plus.audio 未加载
  • 中文需指定 lang: 'zh-CN',否则 iOS 默认英文发音(Android 有时自动识别,但不稳定)
  • 语音质量依赖系统引擎:iOS 用 Siri 引擎,Android 各厂商差异大(华为、小米可能需要用户手动启用 TTS 服务)

如何正确初始化并播放一句话

不能直接 new 实例就播,plus.audio.createSpeech 返回的是一个对象,要显式调用 start(),且需处理平台兼容性兜底。

if (uni.getSystemInfoSync().platform === 'app') {
  plus.ready(() => {
    const speech = plus.audio.createSpeech('你好,欢迎使用', {
      lang: 'zh-CN',
      voice: 'xiaoyan', // Android 可选,iOS 忽略
      pitch: 1,
      rate: 1
    });
    speech.start();
    speech.onerror = (e) => {
      console.error('TTS error:', e.message); // 如 'No TTS engine available'
    };
  });
}
  • voice 参数在 Android 上可选(如 xiaoyan、yunyan),iOS 不识别,填了也无效
  • pitch(音调)和 rate(语速)取值范围都是 0.5–2,超出会被截断,设成 0 或 3 不报错但无效果
  • 同一时间只能有一个 speech 实例在播放,重复调用 start() 会中断前一个 —— 如需队列,得自己维护状态
  • 没网络时 iOS 仍可播(离线引擎),但部分 Android 厂商(如 OPPO)TTS 需联网下载语音包,首次可能卡住

遇到「No TTS engine available」怎么办

这不是代码写错了,是用户设备没启用系统级语音合成功能,尤其 Android 碎片化严重。

  • iOS:设置 → 辅助功能 → 朗读内容 → 开启「朗读所选内容」即可(无需额外安装)
  • Android:进入「设置 → 语言与输入 → 文字转语音(TTS)输出」,确认默认引擎已安装并设为启用
  • 华为/荣耀用户常卡在「智慧语音」未开启,需去「设置 → 智慧助手 → 智慧语音」里打开
  • 代码里可加提示:speech.onerror 捕获后,弹出 uni.showToast({ title: '请在系统设置中启用文字转语音' })

为什么不用 WebView 内嵌 Web Speech API

因为 App 端的 window.speechSynthesis 在 5+ WebView 中被禁用(安全策略),即使写了也不会触发 onvoiceschanged,getVoices() 返回空数组,speechSynthesis.speak() 静默失败。

  • 这不是 bug,是 5+ Runtime 明确限制:Web Speech API 仅在 H5 环境(即浏览器中)可用
  • 试图用 uni.navigateTo({ url: 'tts.html' }) 打开本地 HTML 也无效——该页面仍在 5+ WebView 容器内
  • 所以别绕路,老实用 plus.audio.createSpeech,它是唯一稳定路径

真正麻烦的是 Android 多厂商 TTS 引擎行为不一致,比如小米可能把「小艺」当默认,但不支持 lang: 'zh-CN' 参数;测试时至少覆盖华为、小米、OPPO、vivo 的最新系统版本,别只信模拟器。

PHP速学视频免费教程(入门到精通)
PHP速学视频免费教程(入门到精通)

PHP怎么学习?PHP怎么入门?PHP在哪学?PHP怎么学才快?不用担心,这里为大家提供了PHP速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
python是前端还是后端
python是前端还是后端

Python属于前端也属于后端,其灵活性和丰富的生态系统使得开发人员能够在不同的领域中灵活运用。本专题为大家提供python相关的文章、下载、课程内容,供大家免费下载体验。

2023.08.11

2823

5

前端如何实现即时通讯
前端如何实现即时通讯

实现即时通讯的方法有WebSocket、Long Polling、Server-Sent Events、WebRTC等等。详细介绍:1、WebSocket,它可以在客户端和服务器之间建立持久连接,实现实时的双向通信,前端可以使用 WebSocket API来创建WebSocket连接,并通过发送和接收消息来实现即时通讯;2、Long Polling,是一种模拟实时通信的技术等等。

2023.10.09

6143

6

前端和后端的区别
前端和后端的区别

前端关注的是用户界面的设计和交互,而后端则注重数据处理和逻辑控制。想了解更多前端后端的相关内容,可以阅读本专题下面的文章。

2024.03.19

7070

13

php和前端的关联介绍
php和前端的关联介绍

php既可以作为前端语言,也可以作为后端语言。想了解更多php和前端的相关内容,可以阅读本专题下面的文章。

2024.03.22

6878

10

前端外包工作内容有哪些
前端外包工作内容有哪些

前端外包工作内容包括:1. 网站和应用程序开发;2. 用户界面和交互设计;3. 用户体验优化;4. 设计和视觉开发;5. 跨浏览器兼容性;6. 性能优化;7. 维护和更新;8. 项目管理和沟通。想了解更多前端的相关内容,可以阅读本专题下面的文章。

2024.05.22

983

5

Docker Desktop怎么设置端口映射
Docker Desktop怎么设置端口映射

本专题聚焦Docker Desktop容器端口映射与访问配置,整理从创建容器、设置端口绑定到验证本地服务访问的操作流程。针对端口被占用、映射配置错误、容器服务无法访问等情况,也提供相应的检查方向,方便用户完成端口配置。

2026.11.03

0

18

Docker Desktop镜像构建教程
Docker Desktop镜像构建教程

想使用Docker Desktop将本地项目构建成Docker镜像?本专题围绕镜像构建的实际操作展开,介绍Dockerfile编写、构建命令使用、镜像标签设置和构建日志查看等内容,同时整理镜像无法生成、依赖安装失败及构建缓存异常等问题的排查思路。

2026.11.03

0

11

Docker Desktop容器创建指南
Docker Desktop容器创建指南

本专题聚焦Docker Desktop容器创建与运行配置,介绍通过本地镜像或远程镜像创建容器的方法,以及容器启动、终端访问、日志查看和基础管理等操作。针对端口冲突、参数配置不当、容器无法启动等情况,也整理了相应的排查方向。

2026.11.03

0

11

Tailwind CSS 如何制作导航栏和卡片
Tailwind CSS 如何制作导航栏和卡片

用 Tailwind CSS 制作导航栏和卡片,可先搭建语义化结构,再组合 Flex、Grid、间距、圆角与阴影类。这里整理横向导航、移动端菜单、卡片网格及悬停效果的相关文章,帮助你把常见页面组件做得清晰且适配不同屏幕。

2026.11.03

0

17

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
热门推荐
/
最新课程
phpStudy极速入门视频教程
phpStudy极速入门视频教程

共6课时 | 54.7万人学习

独孤九贱(4)_PHP视频教程
独孤九贱(4)_PHP视频教程

共89课时 | 134.1万人学习