Question

欢迎，我不知道如何将客户端网络摄像头的快照上传到Django中的图像字段，我尝试做一些事情，但是我做不到。

这是我的代码：

models.py

class Attendance_Model_IN(models.Model):
    First_Name= models.CharField(max_length=40)
    Last_Name= models.CharField(max_length=40)
    User_Name=models.CharField(max_length=40)
    Date_Time_IN=models.DateTimeField()
    Image= models.ImageField(blank=True,upload_to="chapters/%y/%m/%D/")
class Attendance_Model_Out(models.Model):
    First_Name= models.CharField(max_length=40)
    Last_Name= models.CharField(max_length=40)
    User_Name=models.CharField(max_length=40)
    Date_Time_OUT=models.DateTimeField()
    Image= models.ImageField(blank=True,upload_to="chapters/%y/%m/%D/")

html代码

<html>
{% load staticfiles %}
<head>
    <link rel="stylesheet" type="text/css" href="{% static 'app/content/main.css' %}" />
        <link rel="stylesheet" type="text/css" href="{% static 'app/content/bootstrap.min.css' %}" />
    <link rel="stylesheet" type="text/css" href="{% static 'app/content/site.css' %}" />
</head>
<body>
    <div class="booth">
       <video id="video" width="400" height="300"></video>
        <a href="#" id="capture" class="booth-capture-button">Take Photo</a>
        <canvas id="canvas" width="400" height="300"></canvas>
        <img src="" alt="photo of you" id="photo"/>
    </div>
    <div id="signdiv"  style="display:none;">
    <form method="POST">
        {% csrf_token %}
        <input type="submit" name="signin" value="Sign In" class="btn btn-default" />
        <input type="submit" name="signout" value="Sign Out" />
    </form>
        </div>
     <script src="{% static 'app/scripts/photo.js' %}"></script>
</body>
</html>

JavaScript代码

(function() {

    var video = document.getElementById('video'),
        canvas = document.getElementById('canvas'),
        context = canvas.getContext('2d');
        photo = document.getElementById('photo'),
        vendorUrl = window.URL || window.webkitURL;

    navigator.getMedia =    navigator.getUserMedia ||
                            navigator.webkitGetUserMedia ||
                            navigator.mozGetUserMedia ||
                            navigator.msGetUserMedia;
    navigator.getMedia({
        video: true,
        audio: false
    }, function(stream) {
        video.srcObject = stream;
        video.play();
        }, function(error) {
        });
    document.getElementById('capture').addEventListener('click', function () {
        

        context.drawImage(video, 0, 0, 400, 300);
        photo.setAttribute('src', canvas.toDataURL('image/png'))

    });
})();

我要在拍摄快照时单击登录按钮，然后将此快照保存到Attendance_Model_IN的“图像”字段中

与退出相同

感谢您的帮助

如何从客户端的网络摄像头上传快照到Django中的image字段？

0 个答案: