更新记录

1.0.0（2025-07-19） 下载此版本

完成语音播报功能

平台兼容性

uni-app(4.62)

其他

jz-h5-tts 语音播报插件

🔊 插件简介

jz-h5-tts 是一个专为 H5 环境设计的文本转语音（Text-to-Speech, TTS）插件，它利用 Web Speech API (SpeechSynthesis 接口) 实现语音播报功能。该插件提供简洁易用的 API 接口，支持模块化设计，易于集成到现有项目中。

✨ 核心特性

🎯 API 设计

• 简洁易用：提供与常见 TTS 插件一致的调用方式
• 模块化架构：核心功能分离，便于维护和扩展
• UMD 格式：支持 AMD/CommonJS/全局变量引入方式

🔊 语音功能

• 文本播报：将文本转换为语音进行播报
• 语音控制：提供播放、暂停、恢复和停止功能
• 参数调节：支持调节语速（rate）、音调（pitch）和选择语音类型（voice）
• 队列管理：实现语音队列管理，支持顺序播放多段文本

📱 技术架构

• Web Speech API：底层使用浏览器原生的 SpeechSynthesis 接口
• Promise 封装：异步操作均使用 Promise 封装，提高代码可读性
• 事件回调：提供丰富的事件回调机制（onStart, onEnd, onError等）
• 浏览器兼容：兼容主流现代浏览器（Chrome, Firefox, Safari, Edge）

📦 安装使用

1. uni-app 项目中使用

// 导入插件
import { startSpeech, stopSpeech, pauseSpeech, resumeSpeech, getEngines } from '@/uni_modules/jz-h5-tts';

// 基础播报
startSpeech({
    content: '这是一段测试文本',
    start: () => {
        console.log('播报开始');
    },
    finish: () => {
        console.log('播报结束');
    },
    fail: (error) => {
        console.error('播报失败:', error);
    }
});

2. 普通 H5 项目中使用

// ES6 模块导入
import { startSpeech, stopSpeech } from './uni_modules/jz-h5-tts/index.js';

// 或者直接引入
<script type="module">
    import { startSpeech, stopSpeech } from './uni_modules/jz-h5-tts/index.js';
    // 使用插件
</script>

🔧 API 文档

startSpeech(options)

开始语音播报。

参数说明

stopSpeech()

停止语音播报，清空播报队列。

pauseSpeech()

暂停当前语音播报。

resumeSpeech()

恢复已暂停的语音播报。

getEngines()

获取可用的TTS引擎列表。

返回值

返回一个数组，包含可用的语音引擎信息：

[
  { name: 'Microsoft David - English (United States)', label: 'Microsoft David - English (United States) (en-US)' },
  { name: 'Microsoft Zira - English (United States)', label: 'Microsoft Zira - English (United States) (en-US)' },
  // 更多语音引擎...
]

destroyTTS()

销毁TTS实例，释放资源。仅供uniapp项目手动销毁实例使用。

🛠️ 错误处理

插件内置了完善的错误处理机制：

• 浏览器兼容性检测和提示
• 权限问题处理
• 语音合成失败的重试机制（最多重试3次）
• 详细的错误信息和错误代码

📋 使用示例

插件提供了完整的示例代码，展示了基础用法和高级配置，包括：

• 文本输入和播报
• 语音引擎选择
• 语速、音调调节
• 播放控制（开始、暂停、恢复、停止）
• 队列管理（添加、播放、删除、清空队列）
• 状态反馈

📝 注意事项

• 该插件依赖于浏览器的 Web Speech API，不同浏览器支持程度可能有差异
• 首次使用时可能需要用户授权麦克风权限（取决于浏览器实现）
• 在移动设备上使用时，建议在用户交互事件（如点击）中触发语音播报