Django video streaming and Safari HTML5 canvas - django

Question

I'm streaming small videos from django view:
def play(request):
filename = settings.VIDEO_URL + extra_path
wrapper = FileWrapper(file(filename, "rb"))
response = HttpResponse(wrapper)
response['Content-Type'] = 'video/mp4'
response['Content-Length'] = os.path.getsize(filename)
return response
And have html code like this:
<video style="display: inline-block; width:500px; height:700px;">
<source type="video/mp4" src="play?v=1111">
<video>
Everything works fine, but i need to get video screenshot from JS for drawing above the video frame in canvas. I'm using it:
var video = document.querySelector('video');
var canvas = document.getElementById('canvas-bg');
var context = canvas.getContext('2d');
var w = canvas.width;
var h = canvas.height;
context.fillRect(0, 0, w, h);
context.drawImage(video, 0, 0, w, h);
It works good in Chrome, but i always getting empty context in Safari after context.drawImage(...).
Before django i used php script, like in this link: Streaming an mp4 through a php file progressively, and safari well worked.
Also if i'm changing:
<source type="video/mp4" src="play?v=1111">
to:
<source type="video/mp4" src="/static/video/myfunnyvideo.mp4">
I can get video context in safari! Why? Can anyone help me please.

Answer 1

Don't know why it happens, maybe some http headers are wrong, but I've found other solution for nginx server (for Apache you can use XSendFile):
def play(request):
extra_path = "myfunnyvideo.mp4"
filename = settings.VIDEO_URL + extra_path
response = HttpResponse(mimetype='video/mp4')
response['Accept-Ranges'] = 'bytes'
response['X-Accel-Redirect'] = filename
return response
and in nginx config (/etc/nginx/sites-available/your-site):
location /videos/ {
internal;
alias /var/www/some-folder/protected-folder;
}