Estoy usando electron con html, css y js. Para mi aplicación de escritorio, quiero importar una imagen de mi almacenamiento local usando una etiqueta img. Sin embargo, mi nombre de archivo contiene un código Unicode (por ejemplo, #). Cuando HTML intenta obtener la imagen, se deshace de la segunda mitad del nombre del archivo a partir de Unicode. Vea el ejemplo a continuación, por favor.
<img src= "path/to/my/example#file.png">Esto se convierte en, src= "ruta/a/mi/ejemplo"
eliminando la parte después de Unicode. Devolviéndome ERR_FILE_NOT_FOUND en la consola.
Sin embargo, usar %23 puede ser una opción. Desafortunadamente, el nombre del archivo es impredecible y cambia según el archivo (importo varias imágenes). Entonces, obtener el nombre del archivo y crear la etiqueta HTML se automatiza usando javascript. ¿Hay alguna forma de que javascirpt capture automáticamente unicode en una cadena (ruta al archivo) y lo aplique para que html pueda leerlo?
Debe 'codificar URL', también conocido como 'codificar por ciento', todos los caracteres especiales. En su ejemplo, reemplace el # con %23 .
También usó incorrectamente : en lugar de = en el atributo:
<img src="path/to/my/example#file.png"># no es un "unicode" como lo llamas. Es simplemente un carácter ASCII simple. Pero, dentro de una URL, resulta ser un carácter reservado , que se usa para indicar un ancla dentro de un recurso, por lo que no forma parte de la ruta del recurso, por lo que ves que se elimina.
Por lo tanto, debe codificar en URL (es decir, codificar en porcentaje) el carácter # como %23 si está destinado a usarse dentro de la ruta, por ejemplo:
<img src="path/to/my/example%23file.png"> Como dijo que necesita generar este HTML a través de JavaScript, necesitará que su secuencia de comandos analice la ruta del archivo y codifique los caracteres reservados según sea necesario. De hecho, JavaScript tiene funciones integradas para este propósito exacto: encodeURI() y encodeURIComponent() .