-1

因为我想使用带有 ludwig 工具箱的烧瓶网络应用程序创建实时面部和语音识别来锁门。如果我单击录制按钮，网页将录制我的声音 1 秒，然后我的声音将被预测并将数据显示为表格或字典。

所以我的问题是如何在不重新加载页面的情况下将我的预测语音显示为表格或 dict 到网页（HTML），因为如果我重新加载页面，我的面部识别程序也会重新加载并使我的程序从头开始。

Python 文件

    from flask import Flask, render_template
    from threading import Timer
    import webbrowser
    import speech_recognition as sr
    from ludwig.api import LudwigModel

    to_predict={"audio_path":["C:/Users/Laptop/Desktop/TUGAS_AKHIR/Fix_ludwig_project/Uploads/speech.wav"]}

    # load the model
    model_path = "results/experiment_run/model"
    model = LudwigModel.load(model_path)

    def execute():
        result = model.predict(data_dict=to_predict)
        if (result['label_predictions'] == ['Dwi'] ).any():
            print ('Door Open')
            z = "DOOR OPEN"
            alhasil = z
            return alhasil
        else :
            print ('Door Lock')
            y = "DOOR LOCK"
            alhasil = y
            return alhasil

    def speech():
        with mic as source:
            while True :
                audio = r.record(source, duration=1)
                try:
                    with open('Uploads\speech.wav', 'wb') as f:
                        f.write(audio.get_wav_data())
                        
                    result = model.predict(data_dict=to_predict)

                    print(result["label_predictions"])
                    hasil= result.to_html()

                    execute()
                    return hasil
                    
                except ValueError:
                    print ('Programe error')

    r = sr.Recognizer()
    mic = sr.Microphone()

    app=Flask(__name__)
    @app.route('/')
    def home():
        return render_template("spchrecog.html")

    @app.route('/record/')
    def record():
        return render_template("spchrecog.html", hasil=speech(), alhasil=execute())
        
    def open_browser():
        webbrowser.open_new('http://127.0.0.1:5000/')

    if __name__ == "__main__":
        Timer(0.5,open_browser).start();
        app.run(port=5000)

HTML 文件

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Voice Recognition Ludwig</title>
<style>
a{
margin:0% 44%;
}
body{
background-image:url({{url_for("static",filename="templates/back.jpg")}});
width:auto;
}
img{
border: 4px solid black;
border-radius:130px;
width:10%;
height:10%;
}
.p1 {
color:rgb(0, 0, 0);
text-align:center;
font-size:25px;
font-family:"Lucida Console", Courier, monospace;
font-weight:bold;
}
.p2 {
color:rgb(0, 0, 0);
text-align:center;
font-size:40px;
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
}
div {
  width: 500px;
  height: 500px;
  background: rgb(255, 255, 255);
  position: relative;
  animation-name: mymove; 
  animation-duration: 5s; 
  animation-fill-mode: forwards;
}
@keyframes mymove {
  from {left: 0px;}
  to {left: 500px;}
}
</style>
</head>
<body>
<p class="p1">VOICE RECOGNITION WITH LUDWIG</p>
<br><br>
<a href="/record/"><img src="{{url_for("static",filename="images.png")}}"></a><br>
<br>
<hr>
            {% if hasil %}
                <h2>  Hasilnya adalah : </h2>
                {{ hasil | safe }}
            {% endif %}
<br>
<hr>
            <div>
                <p class="p2"> {{ alhasil }} </p>
            </div>
</body>
</html>
4

1 回答 1

0

要在不重新加载的情况下更新网站，您需要使用 JavaScript，然后最佳地联系返回数据的 Flask 端点。

于 2021-06-10T07:16:26.967 回答