配合”基于Flask框架调用百度接口实现语音识别功能”使用的前端参考代码
后端代码链接
Python—基于Flask框架调用百度接口实现语音识别功能:基于Flask框架调用百度接口实现语音识别功能（如果链接定向不到文章，可在个人博文中看到）
前端参考
利用js小插件 js-audio-recorder
官方文档：https://www.npmjs.com/package/js-audio-recorder
Tips：如后端view.py中的路由有变化，app.py中的地址有变化，均需要跟随变化下面代码的url地址
<template>
<div>
<Button @click="start_luyin">开始录音Button>
<Button @click="end_luyin">结束录音Button>
<p v-if="messge_audio">
文字内容是： {{messge_audio}}
p>
div>
template>
<script>
import Recorder from 'js-audio-recorder';
var recorder = new Recorder({
sampleBits: 16,
sampleRate: 16000,
numChannels: 1,
});
export default {
data() {
return {
messge_audio: '',
}
},
components: {},
filters: {},
methods: {
start_luyin: function () {
recorder.start().then(() => {
alert('开始录音')
})
},
end_luyin: function () {
recorder.stop()
var pcm_auido = recorder.getPCMBlob()
console.log(pcm_auido)
var fromdata = new FormData()
fromdata.append('pcm_audio', pcm_auido)
this.axios({
url: 'http://127.0.0.1:8080/baiduai/',
method: 'post',
data: fromdata
}).then((res) => {
this.messge_audio = res.data.message
})
}
},
mounted: function () {
console.log('初始化');
},
watch: {},
computed: {}
}
script>
<style>style>
Original: https://blog.csdn.net/weixin_41586213/article/details/127900511
Author: VieneLau
Title: 前端—基于Flask框架调用百度接口实现语音识别功能（使用蓝图blueprint）
原创文章受到原创版权保护。转载请注明出处：https://www.johngo689.com/745193/
转载文章受原作者版权保护。转载请注明原作者出处！