XmlHttpRequest请求元素为None

Question

我正在使用Django，并尝试使用XMLHttpRequest将网络摄像头数据发送到后台(view.py(，以便处理每一帧。我关注这个链接，大多数人都建议用类似的方法来解决我的问题。

$(document).ready(function(){
$('#trigger_button').click(function(){
navigator.mediaDevices.getUserMedia(constraints)
.then(stream => {
document.getElementById("myVideo").srcObject = stream;
})
.catch(err => {
alert('navigator.getUserMedia error: ', err)
});
drawCanvas.width = v.videoWidth;
drawCanvas.height = v.videoHeight;
imageCanvas.width = uploadWidth;
imageCanvas.height = uploadWidth * (v.videoHeight / v.videoWidth);
drawCtx.lineWidth = 4;
drawCtx.strokeStyle = "cyan";
drawCtx.font = "20px Verdana";
drawCtx.fillStyle = "cyan";
imageCanvas.getContext("2d").drawImage(v, 0, 0, v.videoWidth, v.videoHeight, 0, 0, uploadWidth, uploadWidth * (v.videoHeight / v.videoWidth));
imageCanvas.toBlob(postFile, 'image/jpeg');
});
});
function postFile(file) {
var formdata = new FormData();
formdata.append("image", file);
formdata.append("threshold", scoreThreshold);
var xhr = new XMLHttpRequest();
xhr.open('POST', apiServer, true);
xhr.onload = function () {
if (this.status === 200) {
var objects = JSON.parse(this.response);
drawBoxes(objects);
imageCtx.drawImage(v, 0, 0, v.videoWidth, v.videoHeight, 0, 0, uploadWidth, uploadWidth * (v.videoHeight / v.videoWidth));
imageCanvas.toBlob(postFile, 'image/jpeg');
}
else {
alert(this.status);
}
};
xhr.send(formdata);
}

然后，我试图访问view.py中请求中的数据，如下所示：

def control4(request):
print(request.POST.get('image'))
print(request.POST.get('threshold'))
return render(request, 'local.html')

然而，尽管请求。Post.get('reshold'(返回一个值request。POST.get('image'(返回None。此外，此方法重复三次，然后停止发送反馈。我的意思是，control4功能打印3次(我认为它应该一直工作到相机关闭(。

有人知道问题出在哪里吗？

非常感谢。

Answer 1

您必须在request.FILES中查找图像

def control4(request):
print(request.FILES['image'])
print(request.POST.get('threshold'))
return render(request, 'local.html')