使用flask和python的网页中的网络摄像头 [英] web cam in a webpage using flask and python
问题描述
我已经使用keras和tensorflow创建了人脸识别模型，现在我正尝试使用flask和python将其转换为Web应用程序.我的要求是，我需要一个显示在网页上的实时网络摄像头，然后单击按钮以拍摄照片并将其保存到指定的目录，然后应用程序应使用该照片识别该人.如果在数据集中找不到该人，则应该在网页上显示一条消息，提示已找到未知身份.为了完成这项工作，我开始学习烧瓶，此后，对于要求来说，这对我来说非常困难.有人帮我解决这种情况.
I have created a face recognition model using keras and tensorflow, and now I am trying to convert it as a web application using flask and python. My requirement is that, I need a live webcam displayed on the webpage and by clicking on a button it should take the picture and save it to a specified directory, and using that picture the application should recognize the person. if the person is not found in the dataset then a message should be displayed over the webpage that unknown identity is been found. To do this job I have started learning flask and after that when it comes to the requirement it was very difficult for me. somebody help me out to solve this situation.
推荐答案
from flask import Flask,request,jsonify
import numpy as np
import cv2
import tensorflow as tf
import base64
app = Flask(__name__)
graph = tf.get_default_graph()
@app.route('/')
def hello_world():
return """
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<video id="video" width="640" height="480" autoplay></video>
<button id="snap">Snap Photo</button>
<canvas id="canvas" width="640" height="480"></canvas>
</body>
<script>
var video = document.getElementById('video');
if(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
navigator.mediaDevices.getUserMedia({ video: true }).then(function(stream) {
//video.src = window.URL.createObjectURL(stream);
video.srcObject = stream;
video.play();
});
}
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
var video = document.getElementById('video');
// Trigger photo take
document.getElementById("snap").addEventListener("click", function() {
context.drawImage(video, 0, 0, 640, 480);
var request = new XMLHttpRequest();
request.open('POST', '/submit?image=' + video.toString('base64'), true);
request.send();
});
</script>
</html>
"""
# HtmlVideoElement
@app.route('/test',methods=['GET'])
def test():
return "hello world!"
@app.route('/submit',methods=['POST'])
def submit():
image = request.args.get('image')
print(type(image))
return ""`
我已经这样做了，但是问题是，当在装饰器中调用API/submit时，在打印图像变量类型时我将图像存储为HTMLVideoElement，我不知道如何将其转换为Jpeg格式，并且将其用于其他目的.
i have done like this, but the problem is that, when calling the API /submit in decorator, i get my image stored as HTMLVideoElement when print the type of image variable, I dont know how to convert it into Jpeg format and use it for further purpose.
这篇关于使用flask和python的网页中的网络摄像头的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
