javascript - 如何使用 js toDataURL 进入 django 视图

Question

我正在尝试将捕获的图像从网络摄像头保存到我的 django 网站3.2 版本这是我尝试过的

class Document(models.Model):
    booking =models.ForeignKey(Booking,on_delete=models.PROTECT)
    docs = models.ImageField(upload_to=upload_docs)

我的意见.py

#my views function 
...
if request.is_ajax() and request.method == 'POST':
    images = request.FILES.get('canvas')
    print("images" , images)
    format, imgstr = images.split(';base64,') 
    ext = format.split('/')[-1] 
    dataimage = ContentFile(base64.b64decode(imgstr), name='temp.' + ext)

     if dataimage:
         photo = Document.objects.create(
            booking=obj,
            docs = dataimage
            )
         photo.save()

但打印图像值是none，这是我的 JS + html

    const player = document.getElementById('player');
    const canvas = document.getElementById('canvas');
    const context = canvas.getContext('2d');
    const captureButton = document.getElementById('capture');
    console.log(context)
    const imgFormat = canvas.toDataURL();
    console.log(imgFormat)
 
    console.log(canvas)
    const constraints = {
      video: true,
    };
  
    captureButton.addEventListener('click', (e) => {
      context.drawImage(player, 0, 0, canvas.width, canvas.height);
      e.preventDefault();
    });
  
    navigator.mediaDevices.getUserMedia(constraints)
      .then((stream) => {
        player.srcObject = stream;
      });   

<input type="file" name="documents" id="document">
<video id="player" controls autoplay></video>
<button id="capture">Capture</button>
<canvas id="canvas" name="canvas" width=320 height=240></canvas>     

我有什么需要改变的吗？我想我必须从我的 views.py 访问canvasjs 变量，但我不知道如何实现它

标签： javascripthtmldjango