是否可以从 Image 对象创建编码的 base64 URL?

问题描述

我希望创建图像的 base64 内联编码数据，以便使用画布在表格中显示.Python 动态生成和创建网页.就目前而言，python 使用 Image 模块来创建缩略图.创建所有缩略图后，Python 会生成每个缩略图的 base64 数据，并将 b64 数据放入用户网页上的隐藏 span 中.然后，用户点击每个缩略图上与他们感兴趣的相关的复选标记.然后，他们通过单击生成 pdf 按钮创建一个包含所选图像的 pdf 文件.JavaScript 使用 jsPDF 生成隐藏的 span b64 数据以在 pdf 文件中创建图像文件，然后最终生成 pdf 文件.

我希望通过在脚本执行时在内存中生成 base64 缩略图数据来缩短 Python 脚本的执行时间并最大限度地减少一些磁盘 I/O 操作.

这是我想要完成的示例.

导入操作系统、系统导入图片大小 = 128, 128im = Image.open("/original/image/1.jpeg")im.thumbnail(大小)拇指 = base64.b64encode(im)

不幸的是，这不起作用，获取 TypeErorr -

TypeError: 必须是字符串或缓冲区，而不是实例

关于如何实现这一点的任何想法?

首先需要将图片保存为JPEG格式；使用 im.tostring() 方法会返回没有浏览器识别的原始图像数据:

从 io 导入 BytesIO输出 = BytesIO()im.save(输出，格式='JPEG')im_data = output.getvalue()

然后您可以将其编码为 base64:

image_data = base64.b64encode(im_data)如果不是 isinstance(image_data, str):# Python 3，从字节解码为字符串image_data = image_data.decode()data_url = '数据:图像/jpg;base64，' + image_data

这是我用这种方法制作的一个:

不幸的是，Markdown 解析器不允许我将其用作实际图像，但您可以在片段中看到它的实际效果:

I am looking to create base64 inline encoded data of images for display in a table using canvases. Python generates and creates the web page dynamically. As it stands python uses the Image module to create thumbnails. After all of the thumbnails are created Python then generates base64 data of each thumbnail and puts the b64 data into hidden spans on the user's webpage. A user then clicks check marks by each thumbnail relative to their interest. They then create a pdf file containing their selected images by clicking a generate pdf button. The JavaScript using jsPDF generates the hidden span b64 data to create the image files in the pdf file and then ultimately the pdf file.

I am looking to hopefully shave down Python script execution time and minimize some disk I/O operations by generating the base64 thumbnail data in memory while the script executes.

Here is an example of what I would like to accomplish.

import os, sys
import Image
size = 128, 128
    im = Image.open("/original/image/1.jpeg")
    im.thumbnail(size)
    thumb = base64.b64encode(im)

This doesn't work sadly, get a TypeErorr -

TypeError: must be string or buffer, not instance

Any thoughts on how to accomplish this?

You first need to save the image again in JPEG format; using the im.tostring() method would otherwise return raw image data that no browser would recognize:

from io import BytesIO  
output = BytesIO()
im.save(output, format='JPEG')
im_data = output.getvalue()

This you can then encode to base64:

image_data = base64.b64encode(im_data)
if not isinstance(image_data, str):
    # Python 3, decode from bytes to string
    image_data = image_data.decode()
data_url = 'data:image/jpg;base64,' + image_data

Here is one I made with this method:

data:image/jpg;base64,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

Unfortunately the Markdown parser doesn't let me use this as an actual image, but you can see it in action in a snippet instead:

<img src="data:image/jpg;base64,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"/>

这篇关于是否可以从 Image 对象创建编码的 base64 URL?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，WP2