Saltar al contenido

Decodificar Códigos QR con PHP

En el articulo te ense√Īaremos un script que te va permitir decodificar codigos QR con PHP. Ser√° √ļtil¬† a la hora de querer leer los datos guardados en una imagen que contenga un c√≥digo QR.

En un tutorial anterior vimos como generar codigos QR con PHP y HTML.

Para decodificar código QR solo se necesitan 3 pasos:

  1. Crear un formulario HTML para enviar la imagen del código QR.
  2. Descargar la librería para leer los códigos QR
  3. Crear un archivo PHP que se encargue de leer los códigos QR.

Paso 1: Crear un formulario HTML para enviar la imagen del código QR

Para este paso lo que haremos es un archivo llamado index.php, el cual contendrá el formulario para enviar los datos al lector de códigos QR.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Decodificar códigos QR con PHP</title>
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
  <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<link rel="stylesheet" type="text/css" href="qr.css">

</head>
<body class="bg">
  <div class="container">
    <br><br><br>
    <div class="row">
      <div class="col-md-6 offset-md-3 card">
        <div class="panel-heading">
          <h1>Decodificar códigos QR</h1>
        </div>
        <hr>
        <form action="decode.php" method="post" enctype="multipart/form-data">
          <input type="file" name="qrimage" id="qrimage" class="form-control" required=""><br>
          <input type="submit" class="btn btn-md btn-block btn-info" value="Enviar datos" name="">
          
        </form>
        
      </div>
    </div>	

  </div>
  
</body>
</html>

Creando archivo llamado qr.css, para darle una mejor apariencia a nuestro formulario.

html, body{
  width: 100%;
  height: 100;
}
.bg{
  background-image: url('images/bg.jpg');
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; 
}
.card{
  background-color: white; 
  padding: 20px; 
  box-shadow: 10px 10px 5px #888;
  border-radius: 15px;
}

En el paso anterior he creado un formulario para enviar la imagen que contiene un código QR. Dicho archivo se encarga de  enviar los datos del formulario a el archivo nombrado decode.php

Paso 2: Descargar la librería para leer los códigos QR

Para descargar la librería desde Github, he utilizado un manejador de dependencias como los es composer. La instalación de la librería es realmente simple, solo debes abrir tu consola y colocamos el siguiente comando:

Paso 3: Crear un archivo PHP que se encargue de leer los códigos QR

Luego de haber descargado la librería que se encargará de leer los códigos QR, entonces procederé a crear un archivo llamado decode.php, el cual recibe los datos del formulario, para poder leer el código QR.

<?php
namespace Zxing;
if ($_SERVER['REQUEST_METHOD']!='POST'){
  header('location: index.php');
  die();
}
require("vendor/autoload.php");
$qrcode= new QrReader($_FILES['qrimage']['tmp_name']);
$text= $qrcode->text();
?>
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Decodificar códigos QR con PHP</title>
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
  <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<link rel="stylesheet" type="text/css" href="qr.css">
</head>
<body class="bg">
  <div class="container">
    <br><br><br>
    <div class="row">
      <div class="col-md-6 offset-md-3 card">
        <div class="panel-heading">
          <h1>Decodificar códigos QR</h1>
        </div>
        <hr>
        <p><strong>Datos del código QR:</strong></p>
        <p><?php echo $text;?></p>
        <hr>
        <a href="index.php">Decodificar otro</a>
      </div>	
    </div>
  </div>
  
</body>
</html>

En este paso obtenemos el texto contenido en la imagen del código QR.

0/5 (0 Reviews)
Comparte