webアプリで動画の再生ができない

Question

現在、flaskを使用してwebアプリについて学習しています。
動画の再生について以下のリンクを参考にプログラムを作ってみました。
参照リンク
コードに関しては以下の通りです。

import os
import glob

from flask import Flask, render_template, request, redirect, url_for
from flask_backend import Flask_Event


app = Flask(__name__)

@app.route('/video_view', methods=['GET', 'POST'])
def video_view():
    # 対象のディレクトリから動画のpathを抽出
    file_name = glob.glob("static/uploads/*.mp4")
    # 0番目のpathをhtmlへ渡す
    return render_template("video_player.html", file_name=file_name[0])

if __name__ == '__main__':
    from argparse import ArgumentParser

    parser = ArgumentParser()
    parser.add_argument("-p", "--port", default=5000,
                        type=int, help="port to listen on")
    args = parser.parse_args()
    port = args.port
    app.config["port"] = port
    app.run(host="0.0.0.0", port=port, threaded=True, debug=True)

<video controls width="600px" height="300px">
  <source src={{ file_name }} controls>
</video>

上記のコードを動かしたところ、web上では以下のように枠のみ表示されて動かすことができませんでした。

調べてみたのですが、webに対する知識が不足しているため解決策を見つけることができませんでした。
問題点について教えていただきたいです。よろしくお願いします。
*OSはMacOS、flaskは1.1.2を使用しています。

助言をいただき、デバッグによる出力試してみました。出力に関しては以下の写真になります。。。

Comments

[msiz07]

予想では `glob.glob("static/uploads/*.mp4")` でファイル名をうまく取得できてない感じがします。

以下のように、log設定やデバッグ出力を追加したらどうなるか追記してもらえますか？（表示の都合でインデントに全角スペースを使っているのでご注意ください）

```
import os
import glob

from flask import Flask, render_template, request, redirect, url_for
from flask_backend import Flask_Event

app = Flask(__name__)

# log設定追加
import logging
app.logger.setLevel(logging.DEBUG)

@app.route('/video_view', methods=['GET', 'POST'])
def video_view():
　　# 対象のディレクトリから動画のpathを抽出
　　file_name = glob.glob("static/uploads/*.mp4")
　　# デバッグ出力
　　app.logger.debug("file_name: {}".format(file_name))
（以下省略）
```

[Tera0724]

回答ありがとうございます。msiz07様の助言に基づきデバッグをみてみました。画面のスクリーンショットは追記した通りです。ディレクトリ構造はmain.py(上記のpythonファイル)とstatic/が同じ階層でstatic/の中にupload/、その中に動画という構成になっています。そのためmain.pyから見たpathとしては正しいと思うのですが、動画の方に問題があるのでしょうか?

Answer 1

HTMLの「<source src={{ file_name }} controls>」のリンクが問題ないか、以下のように変更して確認したらどうなるでしょうか？（「static/uploads/demo_video.mp4」ファイルがある場合）

<source src={{ url_for("static", filename="uploads/demo_video.mp4", _external=True) }} controls>

（「_external=True」はいらないかも）

うまくいった場合は、「filename=...」に適切な値を渡せるようにコードを調整すれば、動くようになるはずです。

「url_for()」の出力結果を確認したい場合は、デバッグ出力を追加したあたりで以下のコードを追加すればわかると思います（「...」は適当に調整してください）。

app.logger.debug("url_for returnes: {}".format(url_for(...)))

「flask.url_for」については、以下のページなどを参照ください。

• flask.url_for
• 静的ファイル — Flask Documentation (1.1.x)
• エンドポイントとURL