python 实现Flask中返回图片流给前端展示

Python  /  管理员 发布于 7年前   834

场景需求：需要在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 Flaskfrom 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 = img_f.read()    img_stream = base64.b64encode(img_stream)  return img_stream  @app.route('/')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 style="width:180px" src="https:/article/data:;base64,{{ img_stream }}"></body></html>

注意：在img标签中的src一定要按照 data:;base64,{{img_stream}} 的形式添加，否则显示不出图片。

然后启动你的Flask程序，访问http://127.0.0.1:8080 你就可以看到你的图片了。

以上这篇python 实现Flask中返回图片流给前端展示就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持。


  • 上一条：
    python 解决flask 图片在线浏览或者直接下载的问题
    下一条：
    Python注释、分支结构、循环结构、伪选择结构用法实例分析

    • 昵称：

    邮箱：

    0条评论 (评论内容有缓存机制,请悉知!)
    Top

    Copyright·© 2019 侯体宗版权所有· 粤ICP备20027696号 PHP交流群

    侯体宗的博客