如何在不写入磁盘的情况下将 numpy 数组编码为 base64 编码的 PNG？

Question

I want to convert an image, represented as a numpy array, into a base64-encoded PNG string, without writing it as a file to disk first.

The goal is to send this over HTTP, and then display the image in a browser using Javascript. Basically trying to send a numpy image array to a browser without using disk.

I'm very comfortable on the python side, and quite unfamiliar on the JS side.

I don't want to use disk, and I don't want to use tensorflow (which has a related helper API).

I have tried researching, but everything that converts a numpy array to a PNG seems to want to save it to disk. I don't know how to avoid the disk I/O.

Answer 1

Many functions that create files will accept an instance of io.StringIO or io.BytesIO instead of a filename or file object.

Here's an example (in an ipython session) where I use numpngw.write_png (from numpngw , a package I wrote for creating PNG and animated PNG files from numpy arrays) to create a base64-encoded PNG file in a Python bytes object.

First, the imports:

In [39]: import numpy as np                                                              

In [40]: from numpngw import write_png                                                   

In [41]: import io                                                                       

In [42]: import base64                                                                   

Create an image to work with:

In [43]: img = np.random.randint(0, 256, size=(16, 16, 3)).astype(np.uint8)              

Create a BytesIO object, and write the PNG "file" to it.

In [44]: f = io.BytesIO()                                                                

In [45]: write_png(f, img)                                                               

f.getvalue() gets the bytes in the PNG "file". Take a peek at the first 12 bytes:

In [46]: f.getvalue()[:12]                                                               
Out[46]: b'\x89PNG\r\n\x1a\n\x00\x00\x00\r'

Finally, use one of the many encodings available in the base64 library to encode the PNG data:

In [47]: b64 = base64.b64encode(f.getvalue())                                            

In [48]: b64                                                                             
Out[48]: b'iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAInRFWHRDcmVhdGlvbiBUaW1lADIwMTktMTAtMThUMDI6NDY6MTRayfRM7AAAAFF0RVh0U29mdHdhcmUAbnVtcG5ndyAodmVyc2lvbiAwLjAuOS5kZXYwKSwgaHR0cHM6Ly9naXRodWIuY29tL1dhcnJlbldlY2tlc3Nlci9udW1wbmd3aGhwYwAAAxtJREFUeJwBEAPv/AChDcGkLZrMNsaw4b5CRQk90PGcAA05N+8BH3rlSGZVLOn/vleX3mclnyfC1TXEOJYAfLtv7F3kSclGhnJDU93XTTWA2RcAutMYkETtG2kUZMWvbSDAxm0uSm8y0Do6gNQpANrN6Xt3cIoybwKclwb9jEQoIrdE6acAd4IoaaSEuH2mUIZ0tQ5plhBU61nCj7jBqQBQFH2x7wd5HR3IA5jo/jOrlalRhR2xgYRboyOl+MhIxExUhNjqEpz66SGJQNbUrWoAYQIWoEgFXiewRwACPUd35eo0DxDWYcrONkmj1fBGe03/JirvaJLQ79F7uAG2vrCXACLBrKntrzxPLoFa7Wgzl1nNEdo7Fenn7Jd+d2TAAMFELJTkhXAhUpQe3NyIjY9y+QD0Lmn11S/UYf4BcTqE3lMbbQ2iQpS1kcKOtbC2zjx7KovsK1M+JRIClOUzATlVnp8ANJS/zfP2ZTzR4dKjV2XfF3bxFs9Kk9qb+ilBHlBUSr2VA6CHxxVtcuvlkeiDvSA6AFQjA+Hd5vsgjgAcEUPkJx2SgqazSjXcSFFyQHqhgif47p3WOVM2lv0rWc4kSRwE5QCXsYTzOWusqZPbHxZSIWDvPjZcESUQ6FKZ4Pa0XFfdD2rLxp/4PF6w33k75h6uHpMAJWGC0yVRXBRW726WM9BAoX7+KjhLaJ6FhJ5aeRYL092uW8DxFwgPTq/evQg6PgOZAOWyz+saW+gMZukrMeZyQLQcQ5QMzX0sFXBtT7rAs9sEKUIx/HLH6wuTCd+zkzbvbAD6cNATGxklmLG15gwnLIX5bSCFD3wTAhDZwaXTdvUDt6LGc7oma5QfuVKUPGXtm7MAIghIuKbNd6S1wsqG6Ga/cB+wMJYklc5AG4dGzFnK+RbpACrQtchNn9v6o2zXJxjaAIaIY6VW1Db6VNeP/tXKHrusaqy1lssoVdSNGiDMo17vmM4EsTkqSkNMFAMct78+WQCb6h4CwetL6rzaQvUx03qW4GBgPbIEMe2MIS9l7D53VKdtUjhpl28zOqI5bW3YFN4cXne4IEUrgwAAAABJRU5ErkJggg=='