Question

这是我的run.py代码

        from flask import *

        app = flask.Flask(__name__)
        app.config.from_object('config')                          
        @app.route('/', methods=['GET','POST'])
        def new_task():
            if flask.request.method == 'POST':
               tts = flask.request.form['tts']
            if int(tts) == 3:
               return redirect("/tts1")
            function()
                flask.flash(str(tts)+'is being selected')
                   print str(tts)+"output"
            else:
               flask.flash('Parakrant ---->')
                return flask.render_template("tasks.html")
            return redirect('/') 
    @app.route('/tts1')
    def wav():
        print "wavfile reached"
        return flask.render_template("s1.html")

这是我的base.html文件

    <html>
    <head>
        <title>names</title>
      </head>
      <body>
        <div>PS: <a href="/ps">Home</a></div>
        <hr>
        {% block content %}{% endblock %}
      </body>
    </html>

这是我的tasks.html

  {% extends "base.html" %}
  {% block content %}
  <div class="page">
  <table>
  <tr>
  <form action="{{ url_for('new_task') }}" method="POST" class=new-task>
 </tr>
  <tr>
   <td>
   <label>name :</label>
  <select name="name" width="100px">
   <option value="1">name1</option>
  <option value="2">name2</option>
   <option value="3">name3</option>
  <option value="4">name4</option>
  <option value="5">name5</option>
   </select>
  </td>
   <td>
   &nbsp;
   &nbsp;
    <input class="button" type="submit" value="Press">
   <audio controls>
   <source src="ps.wav" type="audio/wav">
  </audio>
   </td>
    </form>
   </tr>
  </table>
   </div>
   </table>
 {% endblock %}

这是我的s1.html

    {% extends "base.html" %}
    {% block content %}
      <div class="page">
      <table>
      <tr>
      <form action="{{ url_for('new_task') }}" method="POST" class=new-task>
      </tr>
      <tr>
      <td>
      <label>name :</label>
      <select name="name" width="100px">
      <option value="1">name1</option>
      <option value="2">name2</option>
      <option value="3">name3</option>
      <option value="4">name4</option>
      <option value="5">name5</option>
      </select>
      </td>
      <td>
      &nbsp;
      &nbsp;
      <input class="button" type="submit" value="Press">
      <audio controls>
        <source src="ps.wav" type="audio/wav">
      </audio>
      </td>
      </form>
       </tr>
       </table>
       </div>
       </table>
    {% endblock %}

在s1.html中，我有一个指向音频wav文件的超链接。我想播放s1.html中的音频文件。 wav文件存在于根目录中抛出错误

获取/ps.wav HTTP / 1.1“404 请告诉我们如何解决这个问题。帮助将受到高度赞赏！

Answer 1

如果您使用默认静态文件配置运行Flask，则应将wave文件放在“static”文件夹中，然后在模板中将其引用为

{{ url_for("static", filename = "ps.wav") }}

Answer 2

在音频文件的情况下，当您提供 <audio src="C://somePath"/> 时，这会引发错误，提示 cannot load local resource. 这是有道理的，因为任何网页都不能简单地提供本地路径并访问您的私人文件。

如果您尝试通过 JS 更改 src property 来使用动态路径播放音频，那么这里是使用 Flask 服务器和 HTML 的示例实现。

<块引用>

server.py

@app.route("/")
    def home():
        return render_template('audioMap.html')

@app.route('/<audio_file_name>')
def view_method(audio_file_name):
    path_to_audio_file = "C:/Audios/yourFolderPath" + audio_file_name
    return send_file(
         path_to_audio_file, 
         mimetype="audio/wav", 
         as_attachment=True, 
         attachment_filename="test.wav")

<块引用>

audioMap.html

{% raw %}
<!DOCTYPE html>
<html>
<body>
    AUDIO: <audio src="Std.wav" controls  >
</body>
</html>
{% endraw %}

说明：

当您在 src 属性下指定音频文件名时，这会在烧瓶中创建一个获取请求，如图所示

127.0.0.1 - - [04/May/2021 21:33:12] "GET /Std.wav HTTP/1.1" 200 -

如您所见，flask 发送了对 Std.wav 文件的 Get 请求。因此，为了处理这个 get 请求，我们编写了一个端点，它接受音频文件名，从本地目录中读取它，然后将其返回。因此音频会显示在 UI 上。

<块引用>

注意：这仅在您使用通过flask 的render_template 方法，或者说，使用flask 作为您的网络服务器。

使用flask框架从html播放wavefile？

2 个答案: