python实现Flask中返回图⽚流给前端展⽰
场景需求:需要在Flask服务器的本地⼀张图⽚返回给前端展⽰出来。
问题疑点:通常前端的<img>标签只会接受url的形式来展⽰图⽚,没试过在返回服务器本地的⼀张图⽚给前端。
因此写个记录⼀下这个看起来有点奇葩的场景(通常个⼈博客,个⼈⽹站没有钱⽤第三⽅的服务都会采⽤存储在服务器本地的⽅法啦。)
项⽬⽬录:
dyy_project
|
|----static (新建flask项⽬时⾃动建的,没有任何⽂件)
|----templates
|-----index.html (前端页⾯)
|----dyy_project.py (flask项⽬启动⽂件)
⽂件内容:dyy_project.py
#!/usr/bin/env python
# coding=utf-8
from flask import Flask
from flask import render_template
app = Flask(__name__)
"""
这是⼀个展⽰Flask如何读取服务器本地图⽚, 并返回图⽚流给前端显⽰的例⼦
"""
def return_img_stream(img_local_path):
"""
⼯具函数:
获取本地图⽚流
:param img_local_path:⽂件单张图⽚的本地绝对路径
:return: 图⽚流
"""
import base64
img_stream = ''
with open(img_local_path, 'r') as img_f:
img_stream = ad()
img_stream = base64.b64encode(img_stream)
return img_streamdjango前端模板
@ute('/')
def hello_world():
img_path = '/home/hogan/Googlelogo.png'
img_stream = return_img_stream(img_path)
return render_template('index.html',
img_stream=img_stream)
if __name__ == '__main__':
app.run(debug=True, port=8080)
⽂件内容:index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Flask Show Image</title>
</head>
<body>
<img src="data:;base64,{{ img_stream }}">
</body>
</html>
注意:在img标签中的src⼀定要按照 data:;base64,{{img_stream}} 的形式添加,否则显⽰不出图⽚。
以上这篇python 实现Flask中返回图⽚流给前端展⽰就是⼩编分享给⼤家的全部内容了,希望能给⼤家⼀个参考,也希望⼤家多多⽀持。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论