网页端:
<html lang="zh"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- <meta name="description" content="用于登录web服务器,进行实时监控与违规拍照"> -->
<!-- <meta name="keywords" content="嵌入式,web,摄像头,监控系统"> -->
<meta name="author" content="">
<title>web图片显示系统</title>
</head>
<body> <!用来显示时间>
<h2 align=right><font color="#cc0033">
<body onload="show()">
<div id="nowDiv"></div>
</font></h2>
</body>
<body>
<div>
<img src="{{ url_for('static', filename='test.jpg') }}" height="400">
</div>
<a href="{{ url_for('pic_up') }}" class="btn btn-success btn-lg" role="butoon">上一个图</a>
<a href="{{ url_for('pic_down') }}" class="btn btn-success btn-lg" role="butoon">下一个图</a>
</body>
<script>
function show(){
var date = new Date(); //日期对象
var now = "";
now = date.getFullYear()+"年"; //读英文就行了
now = now + (date.getMonth()+1)+"月"; //取月的时候取的是当前月-1如果想取当前月+1就可以了
now = now + date.getDate()+"日";
now = now + date.getHours()+"时";
now = now + date.getMinutes()+"分";
now = now + date.getSeconds()+"秒";
document.getElementById("nowDiv").innerHTML = now; //div的html是now这个字符串
setTimeout("show()",1000); //设置过1000毫秒就是1秒,调用show方法
}
</script>
</html>
后端:
python源码:
from flask import Flask, render_template, Response, request, make_response
import io,cv2,os,shutil
import datetime
def chdir(path):
# 引入模块
import os
# 去除首位空格
path = path.strip()
# 去除尾部 \ 符号
path = path.rstrip("\\")
# 判断路径是否存在
# 存在 True
# 不存在 False
isExists = os.path.exists(path)
# 判断结果
if not isExists:
# 如果不存在则创建目录
# 创建目录操作函数
print(path + ' 目录不存在')
return False
else:
# 如果目录存在则不创建,并提示目录已存在
print(path + ' 目录已存在')
return True
#读取备份文件列表
def read_filename(filePath):
import os
name = os.listdir(filePath)#获取filepath的文件列表
# print(name)
return name
#检查和创建文件夹
if chdir('static/pictures')==False:
os.mkdir('static/pictures')
if chdir('videos')==False:
os.mkdir('videos')
print(len(read_filename('static/pictures')))
if len(read_filename('static/pictures'))!=0:
pic_num=1
files = "static/pictures/%d.jpg"%(pic_num)
# 打开源文件图片
file=open(files,"rb")
data=file.read()
file.close()
# 打开复制后的图片,没有则创建
new_file=open("static/test.jpg","wb")
# 将原图片内容通过二进制形式写入新的图片文件
new_file.write(data)
new_file.close()
app = Flask(__name__)
@app.route('/')
def index():
return render_template('monitor.html')
@app.route('/pic_up')
def pic_up():
global pic_num
if len(read_filename('static/pictures'))!=0:
print(pic_num)
if pic_num > 1:
pic_num= pic_num-1
print(pic_num)
files = "static/pictures/%d.jpg"%(pic_num)
#打开源文件图片
file=open(files,"rb")
data=file.read()
file.close()
#打开复制后的图片,没有则创建
new_file=open("static/test.jpg","wb")
#将原图片内容通过二进制形式写入新的图片文件
new_file.write(data)
new_file.close()
return render_template('monitor.html')
# return render_template('monitor.html')
@app.route('/pic_down')
def pic_down():
global pic_num
if len(read_filename('static/pictures'))!=0:
counts=len(read_filename('static/pictures'))
print(counts,read_filename('static/pictures'))
print(pic_num)
if pic_num < (counts):
pic_num= pic_num+1
print(pic_num)
files = "static/pictures/%d.jpg"%(pic_num)
#打开源文件图片
file=open(files,"rb")
data=file.read()
file.close()
#打开复制后的图片,没有则创建
new_file=open("static/test.jpg","wb")
#将原图片内容通过二进制形式写入新的图片文件
new_file.write(data)
new_file.close()
return render_template('monitor.html')
# return render_template('monitor.html')
@app.route('/pic_save')
def pic_save():
global pic_num,vid
ret, frame = vid.read()
count=len(read_filename('static/pictures'))
count=count+1
img_name = 'static/pictures/%d.jpg'%count
cv2.imwrite(img_name, frame) #训练集写入路径
file=open(img_name,"rb")
data=file.read()
file.close()
new_file=open("static/test.jpg","wb")
new_file.write(data)
new_file.close()
pic_num=len(read_filename('static/pictures'))
return render_template('monitor.html')
if __name__ == '__main__':
app.run(host='192.168.100.94',debug=True,threaded=True)
先运行python ,然后通过输入网页IP:5000就可以登陆到查看网页服务器,通过按键上下页翻看图片