如何在jinja html模板中发送图像?

时间:2017-08-17 02:48:26

标签: python html flask jinja2

所以我已经设置了flask + jinja,我试图在jinja呈现的html文件中显示图像。

在Python中,我将其转换为base64,然后将其发送到模板。我然后使用图像标签来显示图像。

var a = [1, 2, 3, 4, 5, 6]

function someAsyncFunction(n) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("someAsyncFunction: ", n)
      resolve(n)
    }, Math.random() * 1500)
  })
}

//You can run each array sequentially with: 

function sequential(arr, index = 0) {
  if (index >= arr.length) return Promise.resolve()
  return someAsyncFunction(arr[index])
    .then(r => {
      console.log("got value: ", r)
      return sequential(arr, index + 1)
    })
}

sequential(a).then(() => console.log("done"))

我已经确认Python编码是正确的,当我只是编写一个嵌入了base64的html文件时,它就会显示出来。似乎失败的地方是从模板修改输出一点点。特别是:

<img src="data:image/jpeg;base64,{{ myimage }}">

Jinja似乎正在通过在几个看起来不应该的地方添加文本3D来扭转局面。我没有以不同的方式指定任何东西,当我像文本一样打印出myimage时,它出现了我预期的方式,从/ 9j开始,以/ 2Q ==

结束

我不确定是否有某种方式与我在Jijna中解释它的方式有什么关系,但它只是没有加载。我在电子邮件来源中看到了图片src标签,但我没想到要加载图片。

2 个答案:

答案 0 :(得分:1)

将变量myimage标记为安全:

<img src="data:image/jpeg;base64,{{ myimage | safe }}">

简单的单个文件应用程序(使用请求库):

from flask import Flask, render_template_string
import base64
import requests

app = Flask(__name__)

global _base64_encoded_image


@app.route('/')
def index():
    _html_template = '''
        <p><img src="data:image/jpeg;base64,{{ myimage | safe }}"><p>
        <p><img src="data:image/jpeg;base64,{{ myimage | e }}"><p>    
        <p><img src="data:image/jpeg;base64,{{ myimage }}"><p>
    '''
    global _base64_encoded_image
    return render_template_string(_html_template, myimage=_base64_encoded_image)


@app.before_first_request
def before_first_request():
    global _base64_encoded_image
    _url = "http://via.placeholder.com/200?text=Flask/Jinja2"
    _r = requests.get(_url)
    _base64_encoded_image = base64.b64encode(_r.content)
    print _base64_encoded_image


if __name__ == '__main__':
    app.run()

答案 1 :(得分:0)

这看起来像是一个URL编码问题,因为public class MyWebViewClient : WebViewClient { public override void OnReceivedSslError(WebView view, SslErrorHandler handler, SslError error) { base.OnReceivedSslError(view, handler, error); switch (error.PrimaryError) { case SslErrorType.Untrusted: //TODO: break; case SslErrorType.Expired: //TODO: break; case SslErrorType.Idmismatch: //TODO: break; case SslErrorType.Notyetvalid: //TODO: break; } } } 是该base64字母表中使用的字符,其URL编码为=。尝试在base64数据上执行%3D,然后使用Jinja进行渲染。