基于百度API+Flask实现网页版和图灵机器聊天

本文介绍了一种基于前端和后端技术的语音交互实现方案。前端使用HTML、JavaScript和Recorder.js进行语音录制和上传,后端通过Flask接收音频文件并利用audio2text进行语音识别和自然语言处理,最终合成语音反馈。文章详细展示了代码实现过程。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

开发前准备

调用百度和图灵机器人相关的

参考链接:www.cnblogs.com/changtao/p/10596385.html
下载一个网页录音的js插件
链接:https://pan.baidu.com/s/1-dvlmwLlMzO3crZea35kiQ 
提取码:qth0
 

前端开发:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>我是玩具</title>
</head>
<body>
<P><audio id="player" controls autoplay></audio></P>
<button onclick="start_reco()">录音</button>
<button onclick="stop_reco()">发送语音</button>
<div id="content">

</div>

</body>
<script type="text/javascript" src="/static/Recorder.js"></script>
<script type="text/javascript" src="/static/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
    var serv = "服务器ip";

    var reco = null;
    var audio_context = new AudioContext();//音频内容对象
    navigator.getUserMedia = (navigator.getUserMedia ||
        navigator.webkitGetUserMedia ||
        navigator.mozGetUserMedia ||
        navigator.msGetUserMedia); // 做的一个兼容问题

    navigator.getUserMedia({audio: true}, create_stream, function (err) {
        console.log(err)
    });

    function create_stream(user_media) {
        var stream_input = audio_context.createMediaStreamSource(user_media);
        reco = new Recorder(stream_input);
    }


    function start_reco() {
        reco.record();
    }

    function stop_reco() {
        reco.stop();
        reco.exportWAV(function (wav_file) {
            console.log(wav_file);
            var formdata = new FormData(); // form 表单 {key:value}
            formdata.append("reco",wav_file); // form input type="file"
            $.ajax({
            url: serv + "/upload",
            type: 'post',
            processData: false,
            contentType: false,
            data: formdata,
            dataType: 'json',
            success: function (data) {
                console.log(data);
                if(data.code == 0){
                    document.getElementById("player").src="拼接一个提交的地址"+data.filename;
                    document.getElementById("content").innerText=data.content
                }

            }
            })
        });
        reco.clear(); // 每次执行完,清空reco容器
    }

</script>
</html>  

提示:语音处理方法的地址:https://www.cnblogs.com/changtao/p/10596385.html

后端开发:

from flask import Flask,request,redirect,render_template,jsonify,send_file
from uuid import uuid4
import audio2text

app = Flask(__name__)

@app.route('/')
def index():
    return render_template('web_soon.html')

@app.route('/upload',methods=['post'])
def upload():
    fi = request.files.get('reco')
    fi_name = f"{uuid4()}.m4a"
    fi.save(fi_name)

    ret_sb = audio2text.speech_sb(fi_name)  //语音识别的函数
    ret_npl = audio2text.my_npl(ret_sb.get('result'),'123') // 自然语言处理
    ret_hc_filename = audio2text.speech_hc(uuid4(),ret_npl) // 将自然语言处理的结果合成语音

    ret = {
        "filename":ret_hc_filename,
        "content":ret_npl,
        "code":0
    }
    return jsonify(ret)
@app.route("/get_file/<filename>")
def get_file(filename):
    return send_file(filename)

if __name__ == '__main__':
    app.run(('0.0.0.0'),8600)

  

转载于:https://www.cnblogs.com/changtao/p/10602831.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值