模板部分
<view class="voice-button" @touchstart="startRecording" @touchend="stopRecording" @touchcancel="cancelRecording"><u-icon :name="isRecording ? 'mic' : 'mic'" color="#666666" size="24"></u-icon>
</view>逻辑部分
onLoad() {// 初始化录音管理器this.initRecorderManager();
},// 初始化录音管理器initRecorderManager() {// 创建录音管理器this.recorderManager = uni.getRecorderManager();// 监听录音结束事件this.recorderManager.onStop((res) => {console.log('录音结束：', res);// 如果有录音文件，进行语音识别if (res.tempFilePath) {this.recognizeSpeech(res.tempFilePath);console.log(res.tempFilePath, '录音文件');}});// 监听录音错误事件this.recorderManager.onError((res) => {console.error('录音错误：', res);uni.showToast({title: '录音出错',icon: 'none'});this.isRecording = false;});},// 开始录音startRecording() {if (this.loading) return;this.isRecording = true;// 配置录音参数const options = {duration: 60000, // 最长录音时间，单位ms，最大值60000（1分钟）sampleRate: 16000, // 采样率numberOfChannels: 1, // 录音通道数encodeBitRate: 48000, // 编码码率format: 'mp3', // 音频格式frameSize: 50 // 指定帧大小，单位KB};// 开始录音this.recorderManager.start(options);// 设置超时，防止录音时间过长this.recordingTimeout = setTimeout(() => {if (this.isRecording) {this.stopRecording();}}, 60000); // 最长60秒自动停止// 可以添加震动提示用户开始录音uni.vibrateShort({success: function () {console.log('震动成功');}});},// 停止录音stopRecording() {if (!this.isRecording) return;// 清除超时计时器if (this.recordingTimeout) {clearTimeout(this.recordingTimeout);this.recordingTimeout = null;}// 停止录音this.recorderManager.stop();this.isRecording = false;// 可以再次震动提示用户录音结束uni.vibrateShort();},// 取消录音cancelRecording() {if (!this.isRecording) return;// 清除超时计时器if (this.recordingTimeout) {clearTimeout(this.recordingTimeout);this.recordingTimeout = null;}// 停止录音但不处理结果this.recorderManager.stop();this.isRecording = false;uni.showToast({title: '已取消录音',icon: 'none'});},// 将语音转换为文字recognizeSpeech(filePath) {uni.showLoading({title: '正在识别...'});// 使用 uni.uploadFile 上传音频文件uni.uploadFile({url: '你的服务器地址',filePath: filePath,name: 'audio_file', // 与服务器端约定的字段名formData: {// 如果有其他参数，可以在这里附加},header: {Accept: 'application/json'},success: (res) => {uni.hideLoading();console.log('语音识别成功:', res);// 这个地方要加上nextTick才可以响应在页面上面this.$nextTick(()=>{this.userInput = res.data})// try {// // if(res.statusCode==200){// if (this.userInput.length > 0) {// // 可以选择自动发送或让用户手动发送// // this.sendMessage(); // 自动发送// }// // }else {// // uni.showToast({// // title: '语音识别失败',// // icon: 'none'// // });// // }// } catch (error) {// uni.showToast({// title: '解析响应数据失败',// icon: 'none'// });// }},fail: (err) => {uni.hideLoading();console.error('语音识别请求失败:', err);uni.showToast({title: '语音识别请求失败',icon: 'none'});}});},这样结合服务器模型就能实现将语音转换为文字并放入输入框。
