undefinedfix
Sign in

How can JS distinguish code scanning gun input from keyboard input

sonaro edited in Fri, 29 Jul 2022

Questions like title

We are now using angular + NZ Zorro 7.0, and we hope that the code scanning gun input will automatically search, the keyboard input will manually click search

How to distinguish

3 Replies
MRule
commented on Sat, 30 Jul 2022

The principle is to judge the data speed. The input speed of the scanning gun is very fast. The input can be completed in a few milliseconds, and the manual input is very slow.

For angular, you can use @ hostlistener to monitor keyboard events, record the time of each key, and then judge the speed.

Many scanners will add a carriage return at the end of the input, which can also be used for judgment.

talatccan
commented on Sat, 30 Jul 2022

Under the premise that the manufacturer does not have some identification or interface, we can not judge by any method. What you can think of is to monitor keyboard events while triggering the focus event. If you trigger keyboard events in the effective area (for example, if there are only numbers after the code is scanned, only 48-57 will be monitored, which depends on your own needs), that is manual input.

tharangini
commented on Sat, 30 Jul 2022
Scanning gun, as a high-tech product closely combined with optical, mechanical, electronic, software applications and other technologies, is the third generation of main computer input device after keyboard and mouse -- scanning gun Baidu Encyclopedia

First of all, I would like to thank Scherman for his ideas

If it is not necessary to pass parameters when calling the back-end interface, distinguish between "scan gun input" and "manual keyboard input":

By binding a native keyboard monitoring event on the input input box (monitoring the event triggered by the Enter key), and then using the scanner gun to scan, it can be judged whether the current scanner gun will scan after "pressing" the Enter key:

  • The listening event that triggers the Enter key in the input box: in the function triggered by the event (in the Vue.js It may be necessary to prevent the default behavior of the original submit event of the parent form element in form; in angular, if the page will not be refreshed after carriage return, it may not need to be processed), call the search interface to realize automatic search after scanning
  • A listening event that does not trigger the Enter key in the input box

If it is necessary to distinguish "scan gun input" and "manual keyboard input" accurately, or if the scan gun will not trigger the Enter key in the input box after scanning:

The key is to monitor the original input events in the input box, and distinguish them according to the time interval of each trigger input event, because the interval of "input after scanning gun" is usually stable at 5-20 MS, while the interval of "manual keyboard input" is usually more than 50 ms, and the time interval may fluctuate in a large range.

With the help of time interval, fluctuation range, whether the carriage return event will be triggered and other characteristics, and combined with the actual business situation and scenarios such as the brand of the scanning gun, the scanning content, the manual proficiency in the keyboard, and the content that the manual keyboard may input, we can decide how to delimit the man-machine boundary: time interval 50ms or not 100ms; fluctuation range, times beyond the fluctuation range and other factors

lock This question has been locked and the reply function has been disabled.