Skip to main content
Se añadió un ejemplo del código PHP
Origen Enlace
    <div id="qr-reader" class="mb-5"></div>
     <div id="qr-reader-results"></div>
    <input type="text" id="resultado" value="">
    
    <script src=" https://unpkg.com/html5-qrcode" tipo=" texto/javascript"></script>
    <script>
        function comparar()
        {
            var resultado = $('#resultado').val();
            $.ajax({
                url:"nombre_de_tu_archivo.php",
                method:'POST',
                data:{resultado:resultado}, //Variable que debes recibir en PHP como $_POST['resultado']
                success:function(resp)
                {
                    if(resp == 'igual') //En este caso 'igual' es el echo que retorna el PHP, si la consulta se ejecuta bien y coinciden, imprimes el echo 'igual'
                    {
                        alert('Son iguales!');
                        $("#resultado").val('');
                    }
                    else
                    {
                        alert('Son diferentes!');
                        $("#resultado").val('');
                    }
                }
            })
        }
    
        $(document).ready(function() { 
            var resultContainer = document.getElementById('qr-reader-results');
            var lastResult, countResults = 0;
    
            function onScanSuccess(decodedText, decodedResult) {
                if (decodedText !== lastResult) {
                    ++countResults;
                    console.log(`Resultado del escaner: ${decodedText}`); //imprimes en consola para asegurarte que no está vacío
                    $('#resultado').val(decodedText); //Asignas la respuesta al input que habías creado
                    comparar(); //llamas la función donde está tu ajax
                }
            }
    
            var html5QrcodeScanner = new Html5QrcodeScanner(
                "qr-reader", {
                    fps: 10,
                    qrbox: 250
                });
            html5QrcodeScanner.render(onScanSuccess);
        });
    </script>

Este sería el archivo PHP:

<?php
    $resultado = $_POST['resultado'];
    $result_bd = $campo_de_tu_base_de_datos;

    if($resultado == $result_bd){
        echo 'igual'; //igual si sigues mi ejemplo
        // echo 'http://commons.wikimedia.org/' // asi quedaria usando el tuyo
    }
    else{
        echo 'diferentes';
    }
?>

Ajax entiende "solo" que el echo es la respuesta que tiene que usar, yo en el ejemplo la llamo como "resp"

<div id="qr-reader" class="mb-5"></div>
 <div id="qr-reader-results"></div>
<input type="text" id="resultado" value="">

<script src=" https://unpkg.com/html5-qrcode" tipo=" texto/javascript"></script>
<script>
    function comparar()
    {
        var resultado = $('#resultado').val();
        $.ajax({
            url:"nombre_de_tu_archivo.php",
            method:'POST',
            data:{resultado:resultado}, //Variable que debes recibir en PHP como $_POST['resultado']
            success:function(resp)
            {
                if(resp == 'igual') //En este caso 'igual' es el echo que retorna el PHP, si la consulta se ejecuta bien y coinciden, imprimes el echo 'igual'
                {
                    alert('Son iguales!');
                    $("#resultado").val('');
                }
                else
                {
                    alert('Son diferentes!');
                    $("#resultado").val('');
                }
            }
        })
    }

    $(document).ready(function() { 
        var resultContainer = document.getElementById('qr-reader-results');
        var lastResult, countResults = 0;

        function onScanSuccess(decodedText, decodedResult) {
            if (decodedText !== lastResult) {
                ++countResults;
                console.log(`Resultado del escaner: ${decodedText}`); //imprimes en consola para asegurarte que no está vacío
                $('#resultado').val(decodedText); //Asignas la respuesta al input que habías creado
                comparar(); //llamas la función donde está tu ajax
            }
        }

        var html5QrcodeScanner = new Html5QrcodeScanner(
            "qr-reader", {
                fps: 10,
                qrbox: 250
            });
        html5QrcodeScanner.render(onScanSuccess);
    });
</script>
    <div id="qr-reader" class="mb-5"></div>
     <div id="qr-reader-results"></div>
    <input type="text" id="resultado" value="">
    
    <script src=" https://unpkg.com/html5-qrcode" tipo=" texto/javascript"></script>
    <script>
        function comparar()
        {
            var resultado = $('#resultado').val();
            $.ajax({
                url:"nombre_de_tu_archivo.php",
                method:'POST',
                data:{resultado:resultado}, //Variable que debes recibir en PHP como $_POST['resultado']
                success:function(resp)
                {
                    if(resp == 'igual') //En este caso 'igual' es el echo que retorna el PHP, si la consulta se ejecuta bien y coinciden, imprimes el echo 'igual'
                    {
                        alert('Son iguales!');
                        $("#resultado").val('');
                    }
                    else
                    {
                        alert('Son diferentes!');
                        $("#resultado").val('');
                    }
                }
            })
        }
    
        $(document).ready(function() { 
            var resultContainer = document.getElementById('qr-reader-results');
            var lastResult, countResults = 0;
    
            function onScanSuccess(decodedText, decodedResult) {
                if (decodedText !== lastResult) {
                    ++countResults;
                    console.log(`Resultado del escaner: ${decodedText}`); //imprimes en consola para asegurarte que no está vacío
                    $('#resultado').val(decodedText); //Asignas la respuesta al input que habías creado
                    comparar(); //llamas la función donde está tu ajax
                }
            }
    
            var html5QrcodeScanner = new Html5QrcodeScanner(
                "qr-reader", {
                    fps: 10,
                    qrbox: 250
                });
            html5QrcodeScanner.render(onScanSuccess);
        });
    </script>

Este sería el archivo PHP:

<?php
    $resultado = $_POST['resultado'];
    $result_bd = $campo_de_tu_base_de_datos;

    if($resultado == $result_bd){
        echo 'igual'; //igual si sigues mi ejemplo
        // echo 'http://commons.wikimedia.org/' // asi quedaria usando el tuyo
    }
    else{
        echo 'diferentes';
    }
?>

Ajax entiende "solo" que el echo es la respuesta que tiene que usar, yo en el ejemplo la llamo como "resp"

se añadieron 184 caracteres en el cuerpo
Origen Enlace
<div id="qr-reader" class="mb-5"></div>
 <div id="qr-reader-results"></div>
<input type="text" id="resultado" value="">

<script src=" https://unpkg.com/html5-qrcode" tipo=" texto/javascript"></script>
<script>
    function comparar()
    {
        var resultado = $('#resultado').val();
        $.ajax({
            url:"nombre_de_tu_archivo.php",
            method:'POST',
            data:{resultado:resultado}, //Variable que debes recibir en PHP como $_POST['resultado']
            success:function(resp)
            {
                if(resp == 'igual') //En este caso 'igual' es el echo que retorna el PHP, si la consulta se ejecuta bien y coinciden, imprimes el echo 'igual'
                {
                    alert('Son iguales!');
                    $("#resultado").val('');
                }
                else
                {
                    alert('Son diferentes!');
                    $("#resultado").val('');
                }
            }
        })
    }

    $(document).ready(function() { 
        var resultContainer = document.getElementById('qr-reader-results');
        var lastResult, countResults = 0;

        function onScanSuccess(decodedText, decodedResult) {
            if (decodedText !== lastResult) {
                ++countResults;
                console.log(`Resultado del escaner: ${decodedText}`); //imprimes en consola para asegurarte que no está vacío
                $('#resultado').val(decodedText); //Asignas la respuesta al input que habías creado
                comparar(); //llamas la función donde está tu ajax
            }
        }

        var html5QrcodeScanner = new Html5QrcodeScanner(
            "qr-reader", {
                fps: 10,
                qrbox: 250
            });
        html5QrcodeScanner.render(onScanSuccess);
    });
</script>
<div id="qr-reader" class="mb-5"></div>
 <div id="qr-reader-results"></div>
<input type="text" id="resultado" value="">

<script src=" https://unpkg.com/html5-qrcode" tipo=" texto/javascript"></script>
<script>
    function comparar()
    {
        var resultado = $('#resultado').val();
        $.ajax({
            url:"nombre_de_tu_archivo.php",
            method:'POST',
            data:{resultado:resultado},
            success:function(resp)
            {
                if(resp == 'igual')
                {
                    alert('Son iguales!');
                    $("#resultado").val('');
                }
                else
                {
                    alert('Son diferentes!');
                    $("#resultado").val('');
                }
            }
        })
    }

    $(document).ready(function() { 
        var resultContainer = document.getElementById('qr-reader-results');
        var lastResult, countResults = 0;

        function onScanSuccess(decodedText, decodedResult) {
            if (decodedText !== lastResult) {
                ++countResults;
                console.log(`Resultado del escaner: ${decodedText}`); //imprimes en consola para asegurarte que no está vacío
                $('#resultado').val(decodedText); //Asignas la respuesta al input que habías creado
                comparar(); //llamas la función donde está tu ajax
            }
        }

        var html5QrcodeScanner = new Html5QrcodeScanner(
            "qr-reader", {
                fps: 10,
                qrbox: 250
            });
        html5QrcodeScanner.render(onScanSuccess);
    });
</script>
<div id="qr-reader" class="mb-5"></div>
 <div id="qr-reader-results"></div>
<input type="text" id="resultado" value="">

<script src=" https://unpkg.com/html5-qrcode" tipo=" texto/javascript"></script>
<script>
    function comparar()
    {
        var resultado = $('#resultado').val();
        $.ajax({
            url:"nombre_de_tu_archivo.php",
            method:'POST',
            data:{resultado:resultado}, //Variable que debes recibir en PHP como $_POST['resultado']
            success:function(resp)
            {
                if(resp == 'igual') //En este caso 'igual' es el echo que retorna el PHP, si la consulta se ejecuta bien y coinciden, imprimes el echo 'igual'
                {
                    alert('Son iguales!');
                    $("#resultado").val('');
                }
                else
                {
                    alert('Son diferentes!');
                    $("#resultado").val('');
                }
            }
        })
    }

    $(document).ready(function() { 
        var resultContainer = document.getElementById('qr-reader-results');
        var lastResult, countResults = 0;

        function onScanSuccess(decodedText, decodedResult) {
            if (decodedText !== lastResult) {
                ++countResults;
                console.log(`Resultado del escaner: ${decodedText}`); //imprimes en consola para asegurarte que no está vacío
                $('#resultado').val(decodedText); //Asignas la respuesta al input que habías creado
                comparar(); //llamas la función donde está tu ajax
            }
        }

        var html5QrcodeScanner = new Html5QrcodeScanner(
            "qr-reader", {
                fps: 10,
                qrbox: 250
            });
        html5QrcodeScanner.render(onScanSuccess);
    });
</script>
Origen Enlace

Puedes hacer lo siguiente:

  1. Crear un input que almacene el valor que devuelve al leer el QR. Ejemplo: <input type="text" id="resultado" value="">
  2. Al ejecutarse la función onScanSuccess, obtienes el valor que trae la variable decodedText y se lo asignas al value del input que previamente habías creado.

Esta sería más o menos la idea del código:

<div id="qr-reader" class="mb-5"></div>
 <div id="qr-reader-results"></div>
<input type="text" id="resultado" value="">

<script src=" https://unpkg.com/html5-qrcode" tipo=" texto/javascript"></script>
<script>
    function comparar()
    {
        var resultado = $('#resultado').val();
        $.ajax({
            url:"nombre_de_tu_archivo.php",
            method:'POST',
            data:{resultado:resultado},
            success:function(resp)
            {
                if(resp == 'igual')
                {
                    alert('Son iguales!');
                    $("#resultado").val('');
                }
                else
                {
                    alert('Son diferentes!');
                    $("#resultado").val('');
                }
            }
        })
    }

    $(document).ready(function() { 
        var resultContainer = document.getElementById('qr-reader-results');
        var lastResult, countResults = 0;

        function onScanSuccess(decodedText, decodedResult) {
            if (decodedText !== lastResult) {
                ++countResults;
                console.log(`Resultado del escaner: ${decodedText}`); //imprimes en consola para asegurarte que no está vacío
                $('#resultado').val(decodedText); //Asignas la respuesta al input que habías creado
                comparar(); //llamas la función donde está tu ajax
            }
        }

        var html5QrcodeScanner = new Html5QrcodeScanner(
            "qr-reader", {
                fps: 10,
                qrbox: 250
            });
        html5QrcodeScanner.render(onScanSuccess);
    });
</script>