BrowserTools
Publicidad
Inicio / Generadores / Escáner de Códigos QR

Escáner de Códigos QR

Escanea códigos QR desde tu cámara o desde una imagen subida, enteramente en tu navegador.

Cargando Escáner de Códigos QR… Si no ocurre nada, activa JavaScript.

Los códigos QR codifican URL, tarjetas de contacto, credenciales de Wi-Fi, información de pago y texto arbitrario en un código de barras bidimensional compacto que cualquier cámara de smartphone puede leer en menos de un segundo. Pero, ¿qué pasa si necesitas decodificar un código QR de una captura de pantalla, un archivo de imagen o una pantalla secundaria, sin sacar el teléfono? Los navegadores modernos ahora exponen la API BarcodeDetector, una interfaz nativa que procesa los datos de imagen localmente en el dispositivo, lo que hace posible un escaneo de QR totalmente basado en el navegador sin ninguna subida a un servidor ni aplicación de terceros.

Preguntas frecuentes

¿Las imágenes escaneadas o los fotogramas de la cámara se suben a un servidor?
No. Toda la decodificación ocurre localmente dentro de tu navegador. Cuando subes un archivo de imagen, se lee directamente desde la memoria de tu dispositivo usando la API File y se pasa al motor de decodificación del navegador. Los fotogramas de la cámara se procesan en el canal de gráficos del navegador y nunca salen de tu dispositivo. No se registra ni almacena ningún dato.
¿Cómo funciona técnicamente la API BarcodeDetector?
La API BarcodeDetector es una interfaz nativa del navegador que acepta una fuente de imagen, un HTMLImageElement, HTMLCanvasElement, ImageBitmap o Blob, y devuelve una Promise que se resuelve en un array de objetos de código de barras detectados, cada uno con una cadena rawValue y un boundingBox. Internamente delega en los marcos de análisis de imágenes del sistema operativo: Vision.framework en macOS/iOS y ML Kit en Android, de modo que la velocidad y la precisión de detección igualan a las de la aplicación de cámara nativa.
¿Qué navegadores y formatos de código de barras son compatibles?
Los navegadores basados en Chromium (Chrome, Edge, Opera) en escritorio y Android admiten BarcodeDetector y pueden decodificar códigos QR, Aztec, Code 128, Code 39, Code 93, Codabar, Data Matrix, EAN-8, EAN-13, ITF, PDF417 y UPC-A/E. Safari 17 en macOS e iOS 17 añadieron compatibilidad. Firefox no implementa BarcodeDetector; la herramienta mostrará un aviso de compatibilidad del navegador y usará una alternativa en JavaScript.
¿Qué permiso pide el navegador al usar la cámara?
El navegador muestra un aviso estándar de permiso de cámara la primera vez que activas el escaneo en vivo. Esto lo exige la especificación `getUserMedia` y no se puede omitir. Puedes revocar el permiso en cualquier momento en la configuración del sitio de tu navegador. La herramienta solicita solo vídeo, sin audio, y detiene la transmisión de la cámara en cuanto cierras el escáner o te marchas de él.
¿Puedo escanear un código QR desde una captura de pantalla o una imagen de mi ordenador?
Sí. Haz clic en el botón Subir imagen, selecciona cualquier archivo PNG, JPEG o WebP de tu dispositivo, y la herramienta intentará decodificar todos los códigos de barras de la imagen. Esto es especialmente útil para códigos QR recibidos en correos o capturas de pantalla, donde apuntar la cámara de un teléfono a una pantalla resulta incómodo.
¿Por qué a veces falla el escaneo en un código QR válido?
Las causas comunes son los artefactos de compresión JPEG que difuminan los bordes de los módulos, el bajo contraste entre los módulos oscuros y el fondo, un código demasiado pequeño en el encuadre de la imagen, una rotación de más de 45 grados en algunos decodificadores o un daño físico que oculta más de lo que permite el nivel de corrección de errores. Prueba a abrir la imagen en un editor de fotos para aumentar el contraste y la nitidez, y vuelve a subirla.
¿En qué se diferencia esto de simplemente usar la cámara de mi teléfono?
La cámara de tu teléfono es la opción más fácil para códigos físicos en el mundo real. Esta herramienta es más rápida para códigos QR digitales, imágenes en tu pantalla, en archivos adjuntos de correo, en PDF, donde sacar el teléfono y apuntarlo a la pantalla es más lento y menos preciso que simplemente subir el archivo. También te permite inspeccionar el contenido de un código QR antes de abrir la URL, lo que es una comprobación de seguridad útil.
¿Puedo usar esto para verificar un código QR que acabo de generar?
Sí, y es una buena práctica. Después de generar un código QR, descarga la imagen y súbela aquí para confirmar que se decodifica exactamente en la URL o los datos que pretendías. Esto detecta errores como codificar el protocolo equivocado (http frente a https) o un espacio en blanco accidental en la entrada que podría hacer que el código se escanee pero redirija incorrectamente.
¿Es seguro escanear un código QR desconocido con esta herramienta?
La herramienta decodifica el contenido en bruto y lo muestra como texto antes de que realices cualquier acción. Esto es más seguro que escanear directamente con la cámara de un teléfono, que normalmente abre las URL automáticamente. Puedes inspeccionar la URL decodificada, comprobar si tiene dominios o redirecciones sospechosas, y decidir si visitarla, copiarla o descartarla.
¿La herramienta funciona en navegadores móviles?
Sí. En Android, Chrome admite BarcodeDetector de forma nativa, así que el escaneo basado en cámara está disponible. En iOS, Safari 17 o posterior admite la API. La vía de subida de archivos funciona en todos los navegadores móviles. Para el escaneo en vivo con la cámara en el móvil, apuntar la aplicación de cámara predeterminada de tu dispositivo a un código físico suele ser más cómodo, pero la herramienta basada en navegador es útil al decodificar un código QR visible en la misma pantalla.

Acerca de Escáner de Códigos QR

Los casos de uso de un escáner de QR basado en navegador son más amplios de lo que podría parecer a primera vista. Los desarrolladores se encuentran con frecuencia códigos QR en documentación, maquetas de diseño, flujos de autenticación y entornos de prueba donde escanear con un teléfono resulta incómodo. Los profesionales de TI verifican las credenciales de Wi-Fi codificadas en QR antes de desplegar señalización. Los investigadores de seguridad inspeccionan códigos QR en campañas de phishing de forma segura, decodificando la URL sin hacer clic en ella. Los creadores de contenido y los responsables de marketing decodifican los códigos QR de la competencia para ver hacia dónde redirigen. Cualquiera que reciba una imagen con un código QR incrustado puede arrastrarla a esta herramienta y leer el contenido al instante.

La herramienta usa dos vías de decodificación según la compatibilidad del navegador. En los navegadores basados en Chromium (Chrome 88+, Edge 88+, Opera 74+) y Safari 17+, usa la API nativa `BarcodeDetector`, que entrega los datos de imagen en bruto al motor de decodificación integrado del navegador, el mismo motor que usa la aplicación de cámara del sistema operativo. En los navegadores que no admiten `BarcodeDetector`, recurre a una implementación en JavaScript. En ambos casos, los datos de imagen se procesan enteramente en tu dispositivo; nada se sube a ningún servidor. Para el modo de cámara, la herramienta usa la API `getUserMedia` para acceder a la transmisión de tu webcam, procesa los fotogramas localmente y detiene la transmisión en el momento en que te marchas de la página.

Para obtener mejores resultados al subir una imagen, usa una versión de alto contraste del código con al menos 10 píxeles por módulo (cada cuadro negro o blanco). Las imágenes JPEG comprimidas pueden introducir artefactos en los bordes de los módulos que confunden a los decodificadores; los archivos PNG se decodifican de forma más fiable. Si un escaneo falla, prueba a aumentar el brillo y el contraste de la imagen en cualquier editor de imágenes antes de subirla. Para el escaneo en vivo con la cámara, asegúrate de tener una iluminación uniforme sin reflejos fuertes en la superficie del código, y mantén la cámara firme a una distancia en la que el código completo llene aproximadamente la mitad del encuadre.

Cámaras que leen códigos: cómo el escaneo de códigos de barras basado en navegador se hizo posible

Durante la mayor parte de los 70 años de historia del código de barras, leer uno requería hardware especializado: escáneres láser en los supermercados, lectores de mano específicos en los almacenes o, como mínimo, una aplicación móvil nativa con acceso directo a la cámara. La idea de que una página web pudiera decodificar un código de barras en tiempo real sin ningún software instalado habría parecido inverosímil aún en 2015. El cambio vino de dos desarrollos que convergieron: la rápida mejora del rendimiento de las GPU móviles y el acuerdo de los fabricantes de navegadores para estandarizar el acceso a las cámaras de los dispositivos a través de la API `getUserMedia`, que alcanzó una compatibilidad generalizada alrededor de 2016.

Los primeros escáneres de QR basados en navegador dependían enteramente de bibliotecas de JavaScript que implementaban el algoritmo de decodificación Reed-Solomon por software. Funcionaban, pero eran lentos, consumían mucha CPU y eran propensos a fallar con imágenes de bajo contraste o ligeramente borrosas. La mejora crítica llegó cuando Google propuso la Shape Detection API, más tarde refinada en la API BarcodeDetector, que expone los mismos canales de análisis de imágenes acelerados por hardware que usan las aplicaciones nativas. Al delegar en los marcos Vision o ML Kit del sistema operativo, la velocidad de detección mejoró en órdenes de magnitud y la fiabilidad igualó a la de las aplicaciones de cámara nativas.

La API BarcodeDetector se incorporó en Chrome 83 en 2020 y representa una tendencia más amplia de navegadores que absorben capacidades que antes requerían aplicaciones nativas: acceso al sistema de archivos, Bluetooth, USB, portapapeles y ahora la visión artificial. Cada capacidad estandarizada reduce la brecha entre las aplicaciones web y las nativas, aunque los fabricantes de navegadores discrepan sobre hasta dónde extender este acceso. La decisión de Firefox de no implementar BarcodeDetector refleja un debate filosófico en curso sobre si los navegadores deberían exponer API de hardware de bajo nivel siquiera, un debate que el caso de uso del escaneo de códigos de barras hace concreto y práctico.

Publicidad
Publicidad
Publicidad