Как внутри вкладки выполнить определенный код после успешного скана баркода?

Question

[Kizzeon]

У меня есть локальный сайт который открывает человек с подключенным сканером и я хотел бы выполнять определенный js(модальное окно например показывать) после того, как сканнер успешно обработает баркод.

Подскажите, как работает сканнер в вебе(на какое действие его можно тригерить) и каким образом это лучше делать.
В идеале хотел бы без дополнительных библиотек.

Спасибо.

Comments

[Kovalsky]

Ну сысли "как работает сканер в вебе". Сканер это отдельное ПО которое анализирует видеопоток на предмет наличия штрих кодов с некоторой погрешностью. Соответственно ивенты генерирует сам этот сканер, а вы уже сами решаете какую логику выполнять при наступлении того или иного ивента.

Подавляющее большинство сканеров так или иначе являются портами или расширениями для zebra crossing (zxing), старого ведроидного сканера. Например quagga - https://serratus.github.io/

[LebedevFF]

https://stackoverflow.com/questions/21633537/javas...

[Kizzeon]

Kovalsky, Имел ввиду под "как работает сканер в вебе" - какой лучший способ проверять на сайте введенный код, полученный после обработки сканером баркода?
Например какой js event лучше подойдёт( например keydown, или keypress? ) или подойдёт ли просто создать постоянно сфокусированный невидимый инпут, который при ctrl v будет выполнять js код?

[Kizzeon]

LebedevFF, Спасибо за ссылку, прочту

[Kovalsky]

Kizzeon, если под подключенным сканером вы имели в виду реальный аппарат считывающий баркоды, то мой комментарий немного не о том; мне показалось вы говорите о сканере прямо на странице браузера

[Kizzeon]

Kovalsky, Про аппарат

Answer 1

[kocherman]

В 2007г авотматизировал мини-магазин с подобным сканером. Не помню модель (короче, самый дешевый, только шнур USB и неотключаемая пищалка). Драйверов отдельных вроде не требовалось, сканер определялся как Numpad-клавиатура. Собственно сканер тупо набирал отсканированный номер как на обычной клавиатуре. Обработать событие не проблема хоть в браузере, хоть в терминале. Причем оператор может отсканировать код, а может набрать на клавиатуре вручную - и разницы никакой нету, то есть вот это гораздо сложнее отследить, чем просто событие "скана".

Comments

[Kizzeon]

Просто я не имею доступа к самому сканеру и мне нужно понять, какой js event мне следует тригерить( keypress, keydown, или вообще создать невидимый инпут, бесконечно его держать в фокусе и при заполнении текстом выполнять код) чтобы работало все отлично.

[kocherman]

Kizzeon, Там надо как раз смотреть модель. Возможно, прогресс шагнул в сторону.
Стоит еще учитывать, что сами кассиры - люди примитивные. В руках у них нет мышей и тачпадов - только клавиатура. В торговых приложениях нет никаких менюшек и почти нет понятия курсора (разве только для отмены операций). То есть фактически функционал каждой клавиши зависит от текущего режима работы (никаких перемещений фокуса не должно быть). Еще надо отдельно проработать системные комбинации клавишь, чтобы оператор случайно не свернул окно. Я не уверен, что браузер - самое лучшее решение для оболочки. Наверное, отличным выбором будет Kiosk-режима в Electron. По управлению получится что-то вроде Qiwi-аппарата.

Если вы будете работать с торговым оборудованием, самый вынос мозга будет - работа с фискальным регистратором.

[monday_suicide]

kocherman, как бы со сканерами работают не только кассиры, и используются они не только в торговле. Да тот же складской учет взять, без сканера никуда, или учет отправлений на почтовых терминалах.
Взять любой сканер например, сканируя штрих код в ексель, он переводит строчку на следующую.

[kocherman]

Если нет жестко ограниченного списка проприетарного оборудования, которое необходимо использовать, то вместо пистолета для чтения barcode, я бы использовал дешевый смартфон или raspberry pi 0 c маленькой камерой. Не люблю я проприетарный embedded.

Answer 2

[Анатолий]

Приветствую!
Буквально пару месяцев назад решал такую задачу, писал небольшое web-приложение для инвентаризации магазина.
Логику сделал следующую:
добавил глобальной событие на "keydown", и в нём делал фокус на скрытый input.
на самом input'е также установлено событие на нажатие клавиши "Enter". Так как сканер баркодов, после отправки кода также эммулирует нажатие клавиши "Enter", то есть, как бы завершает ввод.
И уже в событие у input'а, на "Enter", запускается функция, в который и происходят различные проверки введённой информации.
Вот пример глобального события:

window.addEventListener("keydown", function() {
  try {
    if (window.editing) return;
    let obj = document.getElementById("barcode");
    if (window.searched) obj.value = "";
    window.searched = false;
    obj.focus();
  } catch (e) {
    console.log(e);
  }
});

тут меня происходят некоторые вспомогательные проверки, например:
если открыто какое-то модальное окошко для редактирования чего-то там, то не переводит фокус при нажатии клавиш (выполнении функции останавливается);
потом происходит непосредственно фокус в нужный input:
далее проверка на переменную searched, этой переменной присваивается true в функции, которая проверяет введённые данные (при событии onEnter), тут происходит очистка поля, для нового скана. Так как дело в том, что когда сканер отправляет например 13ти значный код, то после каждой цифры происходит события "keydown".

Вот как-то так.