Recientemente, surgió una idea para ahorrar en TSD en un almacén y tratar de usar teléfonos móviles baratos (incluso sin protección contra el polvo). Planeo implementar la interfaz en forma de una aplicación web (páginas web normales, HTML + CSS + JS).
Para que todo funcione, debe enseñar a las páginas web a escanear códigos de barras a través de la cámara del teléfono. Obtener datos de la cámara es bastante simple. El trabajo principal es el procesamiento de cuadros. Debajo de Katom hay una descripción general de las soluciones llave en mano existentes y muchas imágenes.
quaggaJS
Referencias
En los resultados de búsqueda, esta es la primera opción. La biblioteca está equipada con un algoritmo de búsqueda de código de barras en la imagen. Admite códigos de barras unidimensionales: EAN, CODE 128, CODE 39, EAN 8, UPC-A, UPC-C, I2of5, 2of5, CODE 93, CODABAR. Admite la instalación a través de NPM o Bower. La interfaz de la biblioteca consta de un objeto Quagga que contiene 7 métodos, todo es bastante simple.
Hay una
página en el
sitio web del proyecto donde puede descargar muestras y probar la biblioteca en acción. Intentamos la muestra No. 1. Es necesario especificar algunas configuraciones, ok, no hay duda.
Como resultado del lanzamiento, no fue posible determinar el código de barras, pero la ubicación del código de barras se determinó bien.
Intentamos la muestra No. 2. De alguna manera sin alegría.
Estamos tratando de cambiar la configuración: coloque "Tamaño de parche" -> "Grande". No El resultado correcto se obtiene configurando `Resolución (lado largo) = 800px`. Sin embargo, en realidad, el lado más grande es de 640 píxeles.
Quizás funcione mejor con imágenes de alta resolución. Bueno, hacemos la tercera muestra (muestra No. 3).
Honestamente, no sé qué tipo de código de barras es y probé todas las configuraciones: no se determinó el cuartel general. Ok, intentemos con otra muestra de alta resolución (muestra 4):
Por alguna razón, no fue posible lograr un resultado con ninguna configuración.
Probemos una muestra "limpia" de la siguiente biblioteca (muestra No. 5):
Este fue reconocido.
javascript-barcode-reader
Referencias
Esta es la segunda biblioteca en el tema. Conoce formatos: Código 128 (UCC / EAN-128), Código 93, Código 39, Estándar / Industrial 2 de 5, Intercalado 2 de 5, Codabar, EAN-13. Es compatible con la instalación a través de NPM, o simplemente puede conectarlo así:
<script src="//unpkg.com/javascript-barcode-reader/dist/javascript-barcode-reader.min.js"></script>
O puede descargar solo un archivo:
javascript-barcode-reader.min.js de tamaño 10 445 bytes.
El proyecto tiene una
página con ejemplos, pero las imágenes se obtuvieron generando códigos y no desde la cámara. Esto no funcionará para nosotros.
Código para probar la bibliotecabarcode-scan.html
<html> <head> <meta http-equiv="content-language" content="ru" /> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <script src="//unpkg.com/javascript-barcode-reader/dist/javascript-barcode-reader.min.js"></script> <script type="text/javascript" src="barcode-scan.js"></script> </head> <body onload='onLoadPage()'> <img id="img1" src="scan02.png" /> </body> </html>
barcode-scan.html
function onLoadPage() { Image = document.getElementById('img1'); javascriptBarcodeReader( Image , { barcode: 'EAN-13',
Muestra no 1. La biblioteca envía a la consola "Error: ¡Error al extraer el código de barras!".
Muestra no 2. La biblioteca envía a la consola "Error: ¡Error al extraer el código de barras!".
Muestra no 3. La biblioteca envía a la consola "Error: ¡Error al extraer el código de barras!".
Muestra no 4. La biblioteca emite "601" a la consola.
Hmm ... ¿tal vez la biblioteca no está conectada correctamente? Probemos esta muestra:
Muestra no 5. La biblioteca emite "10023" a la consola. Genial
Lector de código de barras Dynamsoft
Sitio del proyectoEl núcleo de la biblioteca está escrito en WebAssembly (WASM) y solo envoltorios de JavaScript, lo que no es tan interesante. Conoce formatos:
1D: Código 39, Código 93, Código 128, Codabar, EAN-8, EAN-13, UPC-A, UPC-E, Intercalado 2 de 5 (ITF), Industrial 2 de 5 (Código 2 de 5 Industria, Estándar 2 de 5, Código 2 de 5), ITF-14;
2D: PDF417, Código QR, DataMatrix, Azteca.
Esta es una biblioteca paga, disponible por suscripción, todos los tipos de códigos de barras cuestan
$ 2199 por año , si solo son códigos unidimensionales, el costo disminuye a
$ 1099 por año . Hay una
página1 y una
página2 para experimentos.
Muestra no 1. Si! La respuesta es correcta El área está rodeada con bastante claridad.
Muestra no 2. Si La respuesta es nuevamente correcta. El área también está rodeada con bastante claridad.
Muestra no 3. Ahora sabemos el tipo de este código de barras.
Muestra no 4. La respuesta también es correcta.
Y, aparentemente, te puede gustar esto:
Sin embargo, la primera muestra fue reconocida con un error. E intente nuevamente de esta manera (la
imagen original está muy borrosa ):
Ahora sabemos que hay al menos una biblioteca en funcionamiento, aunque sea de pago.
tobytailor get_barcode_from_image.js
Referencias
Una pequeña biblioteca simple. Conoce solo un formato de código de barras: UPC. Si primero agrega cero a un código de este tipo, obtiene EAN-13.
Probamos la primera muestra:
Resultado: 000204892734. Se reconoce el patrón.
Tome la muestra No. 2 (EAN-13). Solo para trabajar, debe escribir la línea 32 del script de esta manera:
ctx.drawImage(img, 0, 0, width, height);
Resultado: XXXXXXXXXXXXX. Muestra no reconocida.
Toma lo siguiente:
Resultado: XXXXXXXXXXXXX. No reconocido
Probemos algo simple:
Resultado: no reconocido. Quizás necesite ser atendido de tal manera que, además del código de barras, no haya nada en la imagen, excepto el espacio extra.
Resultado: 022334545453.
Y otro EAN-13:
Parcialmente reconocido.
EddieLa BarcodeReader
GithubOtra biblioteca gratuita, con un pequeño atractivo del autor:
Si le gusta y / o usa este proyecto con fines comerciales, considere donar para apoyar mi trabajo.
Si le gusta y / o usa este proyecto con fines comerciales, considere donar para apoyar mi trabajo.
Conoce formatos: Code128, Code93, Code39, Standard / Industrial 2 de 5, Interleaved 2 of 5, Codabar y EAN-13. Tiene una
página para la experimentación.
Muestra no 1. El alcance y el tipo están definidos correctamente. El código fue reconocido con un error.
Muestra no 2. Buen resultado Reconocido correctamente: área, tipo de código de barras y el propio código de barras.
Muestra no 3. Negativamente Ella no puede hacerlo en ángulo.
Muestra no 4. Muy bien, patrón reconocido.
Muestra no 5. Patrón reconocido.
Bueno, loable. Cambios recientes en la biblioteca ocurrieron hace 3 años.
WebCodeCamJS
Referencias
Biblioteca gratuita (licencia MIT). Conoce los siguientes tipos de códigos de barras unidimensionales: Código 128, Código 93, Código 39, Codabar, EAN-13. Capaz de reconocer los códigos QR. En la página del proyecto hay una oportunidad para probar la biblioteca.
Muestra No. 1: No reconocida.
Muestra No. 2: Reconocida correctamente.
Muestra No. 3: No reconocida.
Muestra No. 4: No reconocida.
Muestra No. 5: Reconocida correctamente.
La capacidad de reconocer códigos QR parece interesante, por lo que recolecté 6 muestras para probar esta y las bibliotecas posteriores:
Muestra No. 1: nada.
Muestra No. 2: Nada.
Muestra 3: nada.
Muestra 4: nada.
Muestra No. 5: Nada.
Muestra No. 6: Reconocida.
QR web
Página del proyectoBiblioteca libre Declarado la generación y reconocimiento de códigos QR. En la página del proyecto hay una oportunidad para probar la biblioteca.
Ninguna de las seis muestras fue reconocida. Hay un generador de códigos QR en la página, aquí se reconocen los códigos obtenidos con este generador.
UPD Juntos, en los comentarios (gracias a
TiesP ), fue posible establecer que el algoritmo funciona, simplemente no sabe cómo determinar la orientación del código. Con esto en mente, los nuevos resultados son los siguientes:
Muestra No. 1 - no reconocida.
Muestra No. 2 - no reconocida.
Muestra No. 3 - no reconocida.
Muestra No. 4 - no reconocida.
Muestra No. 5 - reconocida.
Muestra No. 6 - reconocida.
Aparentemente todavía hay algunas restricciones en el fondo, ya que tanto mi muestra como la muestra proporcionada en los comentarios se determinaron en papel:
Resumen
Eso es todo lo que encontré. Encontramos varias implementaciones basadas en una de las anteriores, por ejemplo,
esta . Repito que el criterio de búsqueda principal es que todo el trabajo debe realizarse en el lado del cliente a través de un navegador y sin ninguna instalación adicional. Es decir, la solución debe implementarse en JavaScript y / o Wasm (por
lo tanto,
ZBar no
es adecuado).
Si conoce una biblioteca que cumple con estos requisitos y no está en el artículo, infórmenos.
La calificación de la biblioteca resultante es la siguiente:
El artículo tuvo lugar gracias a la tienda de iluminación en línea
Devine Light .