0

Al mandar HTML emojis o caracteres especiales, las imprime normal

introducir la descripción de la imagen aquí

 <div class="form-group mb-3" >
     <label >Gender ‍♂️♀️</label>
      <select class="form-control" name="gender" >
           <option value="1" >👩 Female</option>
           <option value="2" >👨 Male</option>
           <option value="3" >🧑 Non-binary</option>
           <option value="4" selected>⛔ Not especified</option>
     </select>
</div>

En nodeJs, al imprimir en consola:

    console.log('    👩 ♂️ 🇧🇲 ')
    console.log(`    👩  👨 🇧🇲`)

En consola se imprime así:

introducir la descripción de la imagen aquí

Y el problema es que tengo emojis guardados en mi DataBase y al recibirlos mediante NodeJs no las recononoce y las imprime en ??:

introducir la descripción de la imagen aquí

introducir la descripción de la imagen aquí

Tendría que parsear algo? existe un parse para emojis o algo referente a eso

Actualización, al mandarlo por unicode me imprime:

    console.log('\uD83C\uDDEE\uD83C\uDDF9')
    console.log(`\uD83C\uDDEE\uD83C\uDDF9`)

introducir la descripción de la imagen aquí

1
  • Los emojis tienen una entidad única tienes que convertirlos a su número de entidad para que puedan guardarse como código numéricos que HTML pueda reconocer al momento de insertarlos
    – Rodrigo
    Commented el 8 feb. 2021 a las 19:45

1 respuesta 1

1

He podido observar que hay algunos unicode ('\uD83C\uDDEE\uD83C\uDDF9') que tienes que tienen un mal formato, ya que he probado a usar otros emojis y me lo ha permitido, sin embargo con las secuencias de cadena que dejaste ninguna me ha funcionado.

Ahora bien, la funcion que se usa para obtener el valor numerico de nuestro emoji es codePointAt sin embargo si usaramos solo el valor que nos devuelve codePointAt tendriamos un problema, ya que el formato final NO se encontraria en formato decimal, y nosotros necesitamos el valor de nuestro emoji en formato decimal.

Por ende hacemos uso de toString(10); en este caso para convertir nuestro numero a formato decimal, numero el cual luego podremos usar directamente en el DOM

const unicodeToDecimal = (emoji_unicode) => `${emoji_unicode.codePointAt(0).toString(10)}` | 0;
console.log(String.fromCodePoint(unicodeToDecimal("\ud83d\udc69")));

/*
  Si los emojis van a ser anadidos desde javascript no es necesario realizar todo este proceso
  ya que enrealidad los emojis son directamente renderizados, lo podemos verificar aqui mismo
  usando otro emoji:
*/
document.body.innerHTML += "<br><br> <b>Emoji anadido de manera directa: " + "\ud83e\uddd1" + "</b>";
<body>
   <!-- Para anadir emojis debes anteponer el codigo decimal usando $# -->
   &#128105
</body>

Otro punto importante es que en teoria, si la consola te muestra un emoji estas haciendo magia!, (me refiero a cmd y no la consola integrada de visual studio).

Teoricamente no creo que la terminal este configurada para mostrar este tipo de caracteres al ejecutar el codigo, aunque creo que la consola personalizada de visual studio si que deberia mostrarlos, pero entonces deberia hacerse alguna configuracion supongo.

Otro punto importante es la codificacion en la que tienes guardada tu archivo HTML, ya que si estas usando una codificacion diferente a UTF-8 definitivamente tendras problemas.

Por lo tanto:

  • Verifica la codificacion de tus archivos (debe ser UTF-8), sobre todo tu archivo HTML.
  • Si nodeJS usa una codificacion diferente a UTF-8 mira como puedes establecer la configuracion de uso a UTF-8.
  • Verifica que la base de datos este usando UTF-8 de lo contrario hagas lo que hagas vas a tener problemas de codificacion luego al cargar tus emojis.

Si todo esto no soluciona tu error, entonces puede que la informacion al llegar a la base de datos y luego llegar a nodeJS se este corrompiendo y lo mas probable es que sea por codificaciones incompatibles o diferentes entre si.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.