Каков выход этой функции считывателя QR?

Question

В настоящее время я пытаюсь создать устройство чтения QR-кодов для своего веб-приложения, и я застрял, поскольку не могу определить расположение вывода для выбранной функции.

I 'Используя QR Reader из этого учебного пособия здесь:

https://www.sitepoint.com/create-qr-code-reader-mobile-website/

Пока что я могу открыть камеру своего телефона и сфотографировать QR-код. Затем функция обработает изображение и, если это действительный QR-код, отобразит зашифрованную строку / ссылку на меня в текстовом поле.

Вот код, который я использую в HTML:

<main class="content-wrapper">
    <div class="container-fluid">
        <input type=text class=qrcode-text>
        <label class=qrcode-text-btn>
            <input type=file accept="image/*" 
                             capture=environment 
                             onchange="openQRCamera(this); read();"
                             tabindex=-1>
                         </label>

<script>function openQRCamera(node) {
    var reader = new FileReader();
    reader.onload = function () {
        node.value = "";
        qrcode.callback = function (res) {
            if (res instanceof Error) {
                alert("No QR code found. Please make sure the QR code is within the 
camera's frame and try again.");
            } else {
                node.parentNode.previousElementSibling.value = res;
            }
        };
        qrcode.decode(reader.result);
    };
    reader.readAsDataURL(node.files[0]);
}
</script>
<script src="https://rawgit.com/sitepoint-editors/jsqrcode/master/src/qr_packed.js">
</script>

Так что все здесь работает так, как задумано. Но, двигаясь вперед, я хочу, чтобы мои QR-коды выполняли определенные действия в зависимости от того, какую строку производит QR-ридер.

Например, если в QR-коде записано «победитель», я бы хотел предупредитьвсплывающее окно, поздравляющее пользователя.

Однако мне не удалось найти выход.

Answer 1

Я полагаю, что выходное значение QR-кода создается в функции обратного вызова qrcode и передается как параметр res, как показано здесь:

qrcode.callback = function (res) {

ТакжеНа веб-сайте, который вы указали, говорится, что после завершения считывания QR-кода будет запущена функция обратного вызова:

Как только FileReader закончит чтение файла, мы назначимобратный вызов в библиотеку QR и отправку содержимого файла в функцию декодирования библиотеки. Библиотека вызовет наш обратный вызов и либо возвратит объект Error, либо вернет значение QR-кода в виде строки.

В случае отсутствия ошибки будет выведен параметр res. Я изменил ваш код для всплывающего значения, если чтение прошло успешно, просто добавив alert(res) перед изменением текстового значения:

<main class="content-wrapper">
    <div class="container-fluid">
        <input type=text class=qrcode-text>
        <label class=qrcode-text-btn>
            <input type=file accept="image/*" 
                             capture=environment 
                             onchange="openQRCamera(this); read();"
                             tabindex=-1>
                         </label>

<script>function openQRCamera(node) {
    var reader = new FileReader();
    reader.onload = function () {
        node.value = "";
        qrcode.callback = function (res) {
            if (res instanceof Error) {
                alert("No QR code found. Please make sure the QR code is within the 
camera's frame and try again.");
            } else {
                alert(res);
                node.parentNode.previousElementSibling.value = res;
            }
        };
        qrcode.decode(reader.result);
    };
    reader.readAsDataURL(node.files[0]);
}
</script>
<script src="https://rawgit.com/sitepoint-editors/jsqrcode/master/src/qr_packed.js">
</script>