1

So I was just starting out with flask, and was running through different exercises. Yesterday I deployed a video successfully to my flask webpage, but then today when I ran the same code, I got a black window where the video was supposed to play (image related).

(image related)

Here is my flask code

from flask import Flask, render_template
app = Flask(__name__)

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

if __name__ == "__main__":
    app.run(host="localhost", port=8000, debug=True)

And my HTML code

<html>
<head>
  <meta name="viewport" content="width=device-width">
</head>
<body>
  <video controls="" autoplay="" name="media">
    <source src="file:///C:/Users/(username)/Desktop/Code/Flask/templates/sample.mp4" type="video/mp4">
  </video>
</body>
</html>

My file structure is

Flask\
  -app.py (flask code)
  \templates\
     -video.html (html code)
     -sample.mp4

Linked videos do work, such as https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-1/ollie.mp4

Isaiah
  • 103
  • 11

2 Answers2

1
<source src="file:///C:/Users/(username)/Desktop/Code/Flask/templates/sample.mp4" type="video/mp4">

The problem with this is that this source tag will be rendered in the user's browser and try to resolve the c:\Users path to their own machine.

You may wish to approach this by moving templates/sample.mp4 to static/sample.mp4 (creating the static directory if need be).

Then in the template:

  <video controls="" autoplay="" name="media">
    <source src="{{ url_for('static', filename='sample.mp4') }}" type="video/mp4">
  </video>

Using the url_for method, ensures that the correct link is always generated, regardless of the URL which the app is hosted on (eventually).

If you were to instead write src='/static/sample.mp4' it would work in development, but if your application is later hosted at https://example.com/music/ then this link would point to example.com/static/sample.mp4 when it should be example.com/music/static/sample.mp4.

v25
  • 7,096
  • 2
  • 20
  • 36
  • 1
    That fixed it! Thank you so much!!! I already had a static and template folder after later troubleshooting, but they didn't work until I switched the source to {{ url_for('static', filename='sample.mp4') }}. Not only did you solve my current problem, but also my next when it comes to actually deploy this. You just made my day! – Isaiah Jul 07 '19 at 00:10
0

try to use the relative address not absolute address

  <video controls="" autoplay="" name="media">
    <source src="./sample.mp4" type="video/mp4">
  </video>
dabuside
  • 103
  • 1
  • 8
  • It didn't work, just threw back a 404 error in the terminal. "GET /sample.mp4 HTTP/1.1 404" – Isaiah Jul 06 '19 at 16:32
  • check [this](https://stackoverflow.com/questions/21765692/flask-render-template-with-path/48040453#48040453).It seems you just server the `video.html` not the folder.Try to visit `localhost:8080/sample.mp4` to check if it take effects. – dabuside Jul 06 '19 at 16:46
  • It just threw back. "The requested URL was not found on the server. If you entered the URL manually please check your spelling and try again." – Isaiah Jul 06 '19 at 16:57