Parzibyte's blog

Blog de conocimiento gratuito: linux, programación, open source, bases de datos, android, frameworks, web e informática en general.

JavaScript: convertir archivo a base64

En el post de hoy veremos cómo convertir un archivo (seleccionado en un input de tipo file) a su representación en base64 como cadena usando JavaScript.

Técnicamente hablando, vamos a convertir un File a un string en base64 usando FileReader.

Aunque base64 ocupa más tamaño que el archivo original, en ocasiones es necesario convertir un fichero binario a este formato para su fácil transporte o almacenamiento.

Nota: en este ejemplo aprenderás a convertir un archivo seleccionado en un input, pero puedes hacer lo mismo con un archivo recuperado del OPFS o incluso un archivo descargado con fetch; las posibilidades son infinitas.

(más…)

Extensión de archivo con JavaScript

En este corto post de programación con JS vas a aprender a obtener la extensión de un archivo a partir de su nombre. Por ejemplo, si el archivo es “hola.go” serás capaz de obtener solo la extensión “go”, sin importar cuántos puntos tenga el nombre del archivo.

Será un ejercicio sencillo en donde vamos a ubicar el índice de un carácter con JavaScript y también vamos a cortar la cadena con substring.

(más…)

JavaScript: descargar archivo con fetch

En este post vamos a ver cómo descargar un archivo en segundo plano usando JavaScript del lado del cliente y la función fetch para hacer peticiones HTTP.

Veremos cómo descargar un archivo como blob usando AJAX para después preguntar al usuario en dónde guardarlo, sugiriendo un nombre.

Lo bueno de esto es que podemos enviar parámetros para solicitar la descarga del archivo (por ejemplo, si el mismo estuviera protegido por contraseña o autentificación).

(más…)

SQLite3 en JavaScript con WebAssembly y OPFS

Anteriormente te he hablado de SQLite en el navegador web, ya sea con Svelte o JavaScript puro. Hoy voy a mostrarte otra cosa: cómo invocar a SQLite3 desde WASM o WebAssembly.

Al final vamos a estar invocando la API de SQLite3 de JS desde WebAssembly. Te enseñaré cómo es mi entorno de trabajo y cómo usar SQLite3 con WebAssembly.

(más…)

Imprimir PDF directamente en impresora térmica con JavaScript

El día de hoy te enseñaré a imprimir un PDF de manera directa a una impresora térmica, sin cuadros de diálogo ni confirmaciones de usuario; todo de manera silenciosa.

De esta manera podrás imprimir un PDF generado en cualquier lugar directamente a una impresora térmica.

En estos casos yo siempre prefiero usar comandos ESC POS para imprimir, pero si tú ya tienes tu diseño del PDF entonces veamos cómo hacerlo. Yo lo haré con JavaScript pero verás que se puede hacer con cualquier lenguaje de programación.

(más…)

Consola de depuración en móviles – Herramientas de desarrollador del navegador

Normalmente podemos usar las herramientas de desarrollador del navegador en la computadora de escritorio usando F12 o con “Inspeccionar elemento” para revisar los errores y depurar nuestras aplicaciones web, pero cuando queremos hacerlo en móviles es un poco más complejo.

En este artículo te mostraré cómo usar las herramientas de desarrollador del navegador web en móviles, es decir, teléfonos o tabletas.

(más…)

Impresora térmica con PHP y plugin

Desde hace tiempo presenté mi plugin para comunicación con impresoras térmicas que permite imprimir con comandos ESC POS desde cualquier lugar saltando las limitaciones del navegador web y de los lenguajes de programación.

Hoy te enseñaré cómo usarlo con PHP, aunque técnicamente vamos a usar JavaScript ya que si bien podemos hacer peticiones con PHP, necesitamos hacer estas peticiones desde el cliente y no desde el servidor, sobre todo cuando PHP está en un servidor web.

No te preocupes, será un código muy sencillo y funcionará igualmente con o sin internet. Veamos cómo imprimir en una impresora térmica desde PHP pero en modo cliente.

(más…)

Usando SQLite3 en la web con Sveltekit y @sqlite.org/sqlite-wasm

Estoy muy emocionado porque después de tanto tiempo y gracias al Origin Private File System podremos tener SQLite3 en los navegadores, con todas sus ventajas y todo contenido desde una página web.

Si quieres puedes ver el hola mundo sin Svelte, es decir, con JS puro y aprender cómo usar SQLite3 en el navegador web sin servidores.

Ya había leído eso hace tiempo pero tenías que hacer unas cosas “experimentales”.

El punto es que ando aprendiendo un poco de Svelte con Tailwind haciendo una app de notas (a las que les agregaré encriptación) y me dio curiosidad por ver si SQLite3 ya estaba “portado” totalmente, porque si bien ya existía con WebAssembly no había manera de crear archivos binarios en el navegador web.

Entonces encontré a: https://developer.chrome.com/blog/sqlite-wasm-in-the-browser-backed-by-the-origin-private-file-system/

Y vi que ya era posible. Lo siguiente era hacerlo funcionar con SvelteKit que usa a su vez Vite para todo su entorno.

Te contaré cómo lo hice y de dónde me he guiado.

(más…)