我正在使用HTML和Python构建一个简单的Web应用程序来在画布上显示图像。我也在使用Flask框架。 Image从HTML上传并在Opencv(Python)中处理,然后在HTML制作的画布上显示, 到目前为止我所做的只是上传图像。但我无法在画布上显示。
这里是CSS和HTML代码
p {
font-family: verdana;
font-size: 20px;
}
h2 {
margin-left: 20px;
text-align: center;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="static/test.css">
<title>
CV - Rogier
</title>
</head>
<body>
<h3>
Study
</h3>
<p>
<form action="/hello" method="post">
Asset Tag:<br>
<input type = "file" id = "Image">
<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
var x = document.getElementById("Image");
x.disabled = true;
}
</script>
<input type="submit" value="Submit">
</form>
</p>
<canvas id="myCanvas" width="640" height="400" style="border:1px solid #000000;">
</canvas>
<script>
var n = document.getElementById("Image")
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.font = "30px Arial";
ctx.fillText(n, 10, 50);
</script>
</body>
</html>
和Python代码
from flask import Flask, render_template, request
import cv2
app = Flask(__name__)
@app.route('/')
def index():
return render_template('test.html')
@app.route('/hello', methods=['GET','POST'])
def hello():
if request.method == 'POST':
image = request.form['Image']
get_image = cv2.imread(image,0)
return cv2.imshow(get_image)
else:
return render_template('test.html')
if __name__ == '__main__':
app.run(host = 'localhost', port = 3000, debug=True)
请告诉我我失踪了什么,错了!感谢
答案 0 :(得分:1)
使用FileReader API(readAsDataURL)发布您的图片。
将您的图像写入file with python(谨防base64编码)
然后返回Json with Flask(错误或成功)
根据服务器的结果显示图像或错误消息。
我希望这是足够的信息。快乐的编码