Uniapp 安卓实现讯飞语音听写(复制即用)
在移动应用开发中,语音交互功能能够极大提升用户体验,让操作更加便捷自然。讯飞语音听写技术凭借其高准确率和稳定性,成为众多开发者的选择。本文将详细介绍如何在 Uniapp 项目中,实现安卓端的讯飞语音听写功能,帮助你快速为应用增添实用的语音交互能力。
但是,由于uniapp录音管理器 uni.getRecorderManager()的实时监听音频大小帧的功能onFrameRecorded不支持app,app端只能在录音结束后获取临时录音文件,因此需要把录音文件转成base64,在切片传输给讯飞的接口。
一、准备工作
1. 注册讯飞开放平台账号
首先,你需要前往讯飞开放平台注册账号,完成实名认证。认证通过后,你将获得使用讯飞相关服务的权限。
2. 创建应用并获取 AppID 和密钥
在讯飞开放平台控制台中,创建一个新的应用。创建成功后,你会得到该应用的 AppID、AppKey 和 AppSecret,这些信息在后续集成过程中至关重要,用于验证应用身份。
二、实现代码
以下是已经实现的uniapp在app端的一个简单的利用讯飞语音听写api完成的语音识别的demo,复制代码到你的项目中,把你申请的appid、apiSecret、apiKey替换到代码中,即可运行识别。
<template><div class="asr"><button class="btn" shape="circle" type="info" @touchstart="openMedia" @touchend="stopMedia">按住说话</button><view v-if="show" class="iating"><text text="正在说话中...." color="#49ABFE" size="27rpx" line-height="60rpx" align="center"></text></view></div>
</template><script>
import CryptoJS from "crypto-js";export default {data() {return {config: {hostUrl: "wss://iat-api.xfyun.cn/v2/iat",host: "iat-api.xfyun.cn",appid: "申请的讯飞appid",apiSecret: "申请的讯飞apiSecret",apiKey: "申请的apiKey",uri: "/v2/iat",highWaterMark: 1280,},uniSocketTask: null,show: false,resultText: "",resultTextTemp: "",renderText: ""};},methods: {// 鉴权签名getAuthStr(date) {let signatureOrigin = `host: ${this.config.host}\ndate: ${date}\nGET ${this.config.uri} HTTP/1.1`;let signatureSha = CryptoJS.HmacSHA256(signatureOrigin, this.config.apiSecret);let signature = CryptoJS.enc.Base64.stringify(signatureSha);let authorizationOrigin =`api_key="${this.config.apiKey}", algorithm="hmac-sha256", headers="host date request-line", signature="${signature}"`;let authStr = CryptoJS.enc.Base64.stringify(CryptoJS.enc.Utf8.parse(authorizationOrigin));return authStr;},getUrl() {let date = new Date().toUTCString();let wssUrl =this.config.hostUrl +"?authorization=" +this.getAuthStr(date) +"&date=" +encodeURIComponent(date) +"&host=" +this.config.host;console.log("websocke科大讯飞的地址为", wssUrl);return wssUrl;},// 打开麦克风openMedia() {this.connectSocket();},// 创建连接并返回数据connectSocket() {if (this.uniSocketTask === null) {this.uniSocketTask = uni.connectSocket({url: this.getUrl(),success() {},});this.uniSocketTask.onOpen(() => {console.log("监听到开启连接成功");this.startRecord();});this.uniSocketTask.onClose(() => {console.log("监听到关闭连接成功");this.uniSocketTask = null;});this.uniSocketTask.onError(() => {console.log("监听到连接发生错误");});this.uniSocketTask.onMessage((res) => {const message = JSON.parse(res.data);if (res.data) {console.log("收到服务器消息,并开始渲染", message);this.renderResult(message);if (message.code === 0 && message.data.status === 2) {console.log('最后一条', this.renderText);this.closeSocket();// 注意:这里需要根据实际情况处理事件触发// this.$emit('renderText', this.renderText);}if (message.code !== 0) {this.closeSocket();console.error(message);}} else {console.log("未监听到消息:原因:", JSON.stringify(res));}});} else {console.log("socketTask实例已存在");}},// 发送给科大讯飞的第一帧的模板数据格式getInitialFrame() {return {common: {app_id: this.config.appid,},business: {language: "zh_cn",domain: "iat",accent: "mandarin",dwa: "wpgs", // 可选参数,动态修正vad_eos: 5000,},data: {status: 0,format: "audio/L16;rate=16000",encoding: "lame"},};},// 发送消息sendMessage(sendData) {console.log('发送', JSON.stringify(sendData));this.uniSocketTask.send({data: JSON.stringify(sendData),success() {},fail() {console.log("发送失败");},});},// 关闭连接closeSocket() {console.log("开始尝试关闭连接");this.uniSocketTask.close();},// 开启录音startRecord() {const recordOption = {sampleRate: 16000,format: "mp3",};const recordManager = uni.getRecorderManager();recordManager.onStart(() => {console.log("开始录音");this.show = true;});recordManager.onStop((res) => {console.log("录音停止,文件路径为:", res.tempFilePath);this.sendMessage(this.getInitialFrame());this.pathToBase64(res.tempFilePath).then(base64 => {let buff = base64.split(",")[1];const arrayBuffer = uni.base64ToArrayBuffer(buff);const audioString = this.toString(arrayBuffer);console.log("文件读取成功", audioString.length);let offset = 0;while (offset < audioString.length) {const subString = audioString.substring(offset, offset + 1280);offset += 1280;const isEnd = offset >= audioString.length;let params = {data: {status: isEnd ? 2 : 1,format: "audio/L16;rate=16000",encoding: "lame",audio: btoa(subString)}};this.sendMessage(params);}}).catch(error => {console.error(error);});});recordManager.onError((err) => {console.log("录音出现错误", err);});recordManager.start(recordOption);},// 关闭录音stopMedia() {const recordManager = uni.getRecorderManager();recordManager.stop();this.show = false;},// 工具方法toString(buffer) {var binary = '';var bytes = new Uint8Array(buffer);var len = bytes.byteLength;for (var i = 0; i < len; i++) {binary += String.fromCharCode(bytes[i]);}return binary;},// 录音文件路径转base64pathToBase64(path) {return new Promise((resolve, reject) => {if (typeof plus === 'object') {plus.io.resolveLocalFileSystemURL(path, function(entry) {entry.file(function(file) {var fileReader = new plus.io.FileReader();fileReader.onload = function(evt) {resolve(evt.target.result);};fileReader.onerror = function(error) {reject(error);};fileReader.readAsDataURL(file);}, function(error) {reject(error);});}, function(error) {reject(error);});return;}reject(new Error('not support'));});},// 讯飞回复字段拼接renderResult(jsonData) {if (jsonData.data && jsonData.data.result) {let data = jsonData.data.result;let str = "";let ws = data.ws;for (let i = 0; i < ws.length; i++) {str = str + ws[i].cw[0].w;}if (data.pgs) {if (data.pgs === "apd") {this.resultText = this.resultTextTemp;}this.resultTextTemp = this.resultText + str;} else {this.resultText = this.resultText + str;}this.renderText = this.resultTextTemp || this.resultText || "";}console.log("渲染后的数据为", this.renderText);}}
}
</script><style scoped>
.asr {display: flex;justify-content: center;padding: 20rpx;
}.btn {width: 200rpx;height: 200rpx;
}.iating {position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);display: flex;flex-direction: column;align-items: center;background-color: rgba(0, 0, 0, 0.7);padding: 30rpx;border-radius: 20rpx;z-index: 999;
}</style>