
How to Upload a WebM Video From a Webcam to a Django Site Uploading a WebM video has many purposes including live chat, live video, security and other purposes. This software is all over the internet, and it is very useful for all sorts of purposes. I hope you find this code useful and deploy it yourself, expanding on my ideas to create your own products. I'll explain how to implement basic security, which happens quickly and efficiently without very much cost.
# The models
# app/models.py
def get_file_path(instance, filename):
ext = filename.split('.')[-1]
filename = "%s.%s" % (uuid.uuid4(), ext)
return os.path.join('video/', filename)
class Camera(models.Model):
user = models.ForeignKey(User, on_delete=models.CASCADE, null=True, blank=True, related_name='camera')
frame = models.FileField(upload_to=get_file_path, null=True, blank=True)
last_frame = models.DateTimeField(default=timezone.now)
# The views
# app/views.py
@login_required
@csrf_exempt
def video(request):
cameras = VideoCamera.objects.filter(user=request.user)
camera = None
if cameras.count() == 0:
camera = VideoCamera.objects.create(user=request.user)
camera.save()
else:
camera = cameras.first()
if request.method == 'POST':
try:
form = CameraForm(request.POST, request.FILES, instance=camera)
camera = form.save()
camera.review() # Review the image with sightengine
except:
print(traceback.format_exc())
return HttpResponse(status=200)
return render(request, 'app/video.html', {'title': 'Video', 'form': CameraForm()})
# The forms
# app/forms.py
from django import forms
from app.models import Camera
class CameraForm(forms.ModelForm):
def __init__(self, *args, **kwargs):
super(CameraForm, self).__init__(*args, **kwargs)
class Meta:
model = Camera
fields = ('frame',)
<!-- The template -->
<!-- templates/video.html -->
{% extends 'base.html' %}
{% block content %}
<div id="container">
<video autoplay="true" muted="true" id="video-element" width="100%"></video>
<form method="POST" enctype="multipart/form-data" id="live-form" style="position: absolute; display: none; visibility: hidden;">
{{ form }}
</form>
</div>
{% endblock %}
// The javascript
// templates/video.js
var form = document.getElementById('live-form');
var scale = 0.2;
var width = 1920 * scale;
var height = 1070 * scale
var video = document.getElementById('video-element');
var data;
var mediaRecorder;
var mediaChunks = [];
const VIDEO_INTERVAL = 5000; // The length of each packet to send, ideally more than 5000 ms (5 seconds)
function capture() {
mediaRecorder.stop(); // Stop to recod data
}
const clone = (items) => items.map(item => Array.isArray(item) ? clone(item) : item);
function startup() {
navigator.mediaDevices.getUserMedia({
video: {
width: {
ideal: width
},
height: {
ideal: height
}
},
audio: true
})
.then(function(stream) {
video.srcObject = stream;
video.play();
mediaRecorder = new MediaRecorder(stream);
mediaRecorder.addEventListener("dataavailable", event => {
mediaChunks.push(event.data);
var mediaData = clone(mediaChunks);
var file = new Blob(mediaData, {
'type': 'video/webm'
});
mediaChunks = [];
mediaRecorder.start();
var formdata = new FormData(form);
formdata.append('frame', new File([file], 'frame.webm'));
$.ajax({
url: window.location.href,
type: "POST",
data: formdata,
processData: false,
contentType: false,
}).done(function(respond) {
console.log(respond);
console.log("Sent frame");
});
});
setTimeout(function() {
setInterval(capture, VIDEO_INTERVAL);
}, 5000);
mediaRecorder.start();
}).catch(function(err) {
console.log("An error occurred: " + err);
});
}
startup();
# The API call
# app/apis.py
import requests
import json
params = {
'workflow': 'wfl_00000000000000000US',
'api_user': '000000000',
'api_secret': '000000000000000000'
}
def is_safe(video_path):
files = {'media': open(video_path, 'rb')}
r = requests.post('https://api.sightengine.com/1.0/video/check-workflow-sync.json', files=files, data=params)
output = json.loads(r.text)
if output['status'] == 'failure' or output['summary']['action'] == 'reject':
return False
return True
# And the models.py review call
# app/models.py
import os
from .apis import is_safe
...
def review(self):
if self.frame and not is_safe(self.frame.path):
os.remove(self.frame.path)
self.frame = None
self.save()
Comments (0) Comment
© Uglek, 2022