javascript - 为什么我的 javascript/flask 语音识别代码将结果发布为 None 而没有附加输入框？

Question

我有一个烧瓶应用程序，它使用 js 语音识别将用户的答案附加到 HTML 输入框中。然后将输入发送并附加到下一页的列表中。目前，该列表附加了“无”，并且控制台中没有错误。我一直在使用这个和这个无济于事，也参考了这个和这个

这是 Main.py 代码：

from flask import render_template, Flask, request
import os
from vaderSentiment.vaderSentiment import SentimentIntensityAnalyzer as SIA
import nltk
import io
import os
from nltk.corpus import stopwords

app = Flask(__name__, static_folder = 'static')

# # set the stopwords to be the english version
# stop_words = set(stopwords.words("english"))
# # vader sentiment analyzer for analyzing the sentiment of the text
# sid = SIA()
# # patient.name?


@app.route("/", methods=["GET", "POST"])
def home():
    user = request.values.get('name')
    location = request.values.get('location')
    state = request.values.get('state')
    # if request.method == "POST":
        # with mic as source:
        #     holder = []
        #     for x in info:
        #         audio_data = r.listen(source)
        #         r.adjust_for_ambient_noise(source)
        #         text = r.recognize_google(audio_data, language = 'en-IN')
        #         holder.append(text.lower())
        #         if x == "state":
        #             ss = sid.polarity_scores(holder)
        #             if ss == "neg":
        #                 x.append(str("sad"))
        #             else:
        #                 x.append(str("not sad"))
        #         else:
        #             filtered_words = [words for words in holder if not words in stop_words] # this filters out the stopwords
        #             x.append(filtered_words.lower())

        # return redirect(url_for('care', user = user))

    return render_template('index.html', user = user, location=location, state=state)

@app.route("/care", methods=["POST"])
def care():
    user = request.values.get('name')
    location = request.values.get('location')
    state = request.values.get('state')
    return render_template('list.html', user = user, location=location, state=state)


if __name__ == "__main__":
    #app.run(debug=True)    
    app.run(debug=True, threaded=True)

索引.html：

{% extends "base.html" %}
{% block content %}

<!---------Therapist Section--------->
    <section id="therapist">
        <div class="container" id="therapist_container">
            <div id="button">
              <button type="button" class="btn btn-primary" onclick="record" id="therapist-button" data-toggle="modal" data-target="#myModal">Talk with Delphi</button>
            </div>
            <!-- Modal -->
            <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="vid1Title" aria-hidden="true">
              <div class="modal-dialog modal-dialog-centered" role="document">
                <div class="modal-content">
                  <div class="modal-body">
                    <video width="100%" id="video1">
                      <source src="./static/movie.mp4" type="video/mp4">
                    </video>
                    <form class="texts" action="/care" id="careid" name="care" method="POST">
                      <input type="text" id="name" placeholder="what's your name?">
                      <input type="text" id="location" placeholder="Where are you?">
                      <input type="text" id="state" placeholder="how can I help?">
                      <input id="buttonInput" class="btn btn-success form-control" type="submit" value="Send">
                    </form>
                  </div>
                </div>
              </div>
            </div>
            <script>
              $('#myModal').on('shown.bs.modal', function () {
                  $('#video1')[0].play();
                })
              $('#myModal').on('hidden.bs.modal', function () {
                  $('#video1')[0].pause();
                })

              video = document.getElementById('video1');

              // window.SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;              

              function record() {
                  var recognition = new webkitSpeechRecognition() || SpeechRecognition();
                  recognition.interimResults = true;
                  recognition.lang = "en-US";
 
                  recognition.onresult = function(event) {
                      console.log(event);
                      document.getElementById("name").value = event.results[0][0].transcript;
                  }
                  recognition.start();

                  recognition.addEventListener("end", () =>{
                    recognition.start
                    recognition.onresult = function(event) {
                      // console.log(event);
                      document.getElementById("location").value = event.results[0][0].transcript;
                  }
                  })

                  recognition.addEventListener("end", () =>{
                    recognition.start
                    recognition.onresult = function(event) {
                      // console.log(event);
                      document.getElementById("state").value = event.results[0][0].transcript;
                    }
                    recognition.addEventListener("end", () => {
                      window.location.pathname = '/care';
                      document.care.submit();
                    });
                  })
                }              
              // video.addEventListener('ended',function(){       
              //    window.location.pathname = '/care';
              //    document.care.submit();
              // })
            </script>
        </div>
    </section>
{% endblock content %}  

列表.html：

{% extends "base.html" %}
{% block content %}

<!----LIST------>
<section id="care_list">
    <div class="container" id="care_list_container">
        <h1 class="jumbotron text-center" id="care_list_title">{{ user }} Care Record</h1>
        <div class="container">
            <table class="table table-hover"> 
                <thead>
                  <tr>
                    <th scope="col">Session #</th>
                    <th scope="col">Length</th>
                    <th scope="col">Location</th>
                    <th scope="col">State</th> 
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <th scope="row">1</th>
                    <td>{{ length }}</td>
                    <td>{{ location }}</td>
                    <td>{{ state }}</td>
                  </tr>
                  <tr>
                    <th scope="row">2</th>
                    <td></td>
                    <td></td>
                    <td></td>
                  </tr>
                  <tr>
                    <th scope="row">3</th>
                    <td colspan="2"></td>
                    <td></td>
                  </tr>
                </tbody>
              </table>
        <ul class="list-group list-group-flush" id="care_list">
            <li class="list-group-item">Please email [e-mail] for help.</li>
        </ul>
    </div> 
</section> 
{% endblock content %}

这是输出和控制台的屏幕截图：

标签： javascriptpythonhtmlspeech-recognition