versiones guia español descargar actualizar python css image base64 data-uri

python - guia - qgis manual



¿Cómo codifica base-64 una imagen PNG para su uso en un uri de datos en un archivo CSS? (4)

Quiero base-64 codificar un archivo PNG, para incluirlo en una URL de datos en mi hoja de estilos. ¿Cómo puedo hacer eso?

Estoy en una Mac, así que algo en la línea de comandos de Unix funcionaría genial. Una solución basada en Python también sería grandiosa.


En python3, base64.b64encode devuelve una instancia de bytes , por lo que es necesario llamar a decode para obtener str , si está trabajando con texto unicode.

# Image data from [Wikipedia][1] >>>image_data = b''/x89PNG/r/n/x1a/n/x00/x00/x00/rIHDR/x00/x00/x00/x05/x00/x00/x00/x05/x08/x06/x00/x00/x00/x8do&/xe5/x00/x00/x00/x1cIDAT/x08/xd7c/xf8/xff/xff?/xc3/x7f/x06 /x05/xc3 /x12/x84/xd01/xf1/x82X/xcd/x04/x00/x0e/xf55/xcb/xd1/x8e/x0e/x1f/x00/x00/x00/x00IEND/xaeB`/x82'' # String representation of bytes object includes leading "b" and quotes, # making the uri invalid. >>> encoded = base64.b64encode(image_data) # Creates a bytes object >>> ''data:image/png;base64,{}''.format(encoded) "data:image/png;base64,b''iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==''" # Calling .decode() gets us the right representation >>> encoded = base64.b64encode(image_data).decode() >>> ''data:image/png;base64,{}''.format(encoded) ''data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==''

Si está trabajando directamente con bytes , puede usar la salida de base64.b64encode sin más decodificación.

>>> encoded = base64.b64encode(image_data) >>> b''data:image/png;base64,'' + encoded b''data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==''


Esto debería hacerlo en Unix :

b64encode filename.png X | sed ''1d;$d'' | tr -d ''/n'' > b64encoded.png

La imagen codificada producida por b64encode incluye un encabezado y un pie de página, y ninguna línea de más de 76 caracteres. Este formato es típico en las comunicaciones SMTP.

Para que la imagen codificada se pueda insertar en HTML / CSS, los comandos sed y tr eliminan el encabezado / pie de página (primera y última línea) y todas las líneas nuevas, respectivamente.

Entonces simplemente use la cadena larga codificada en HTML

<img src="data:image/png;base64,ENCODED_PNG">

o en CSS

url(data:image/png;base64,ENCODED_PNG)


Esto debería hacerlo en Python:

import base64 encoded = base64.b64encode(open("filename.png", "rb").read())


b64encode no está instalado por defecto en algunas distribuciones (respuesta de @Clint Pachl), pero Python sí.

Entonces, solo usa:

python -mbase64 image.jpeg | tr -d ''/n'' > b64encoded.txt

Para obtener una imagen codificada en base64 desde la línea de comando.

Los pasos restantes ya fueron respondidos por @Clint Pachl ( https://.com/a/20467682/1522342 )