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