Guardar contácto en formato VCARD en código QR

En esta sección vamos a generar un código QR que contendrá los datos de un contacto en formato vcard

para ello crearemos un formulario en el que pediremos los datos de una persona para luego ser enviados a nuestra pagina que generará el código QR  con nuestro contacto.

Esta es la  estructura de nuestro formulario, para este formulario estoy usando bootstrap

<form method='post' id="generador">

 <div class='row'>

  <div class='col-md-6'>

  <div class="form-group">

  <input type="text" class="form-control m-2" id="names" placeholder="Nombre"> 

  <input type="text" class="form-control m-2" id="lastnames" placeholder="Apellido">

  <input type="text" class="form-control m-2" id="celular" placeholder="celular">

  <input type="text" class="form-control m-2" id="telefono" placeholder="Teléfono">

  <input type="text" class="form-control m-2" id="correo" placeholder="Correo">

  <input type="text" class="form-control m-2" id="organizacion" placeholder="Organización">

  <input type="text" class="form-control m-2" id="direccion" placeholder="Dirección">

  <input type="text" class="form-control m-2" id="url" placeholder="Url">

  <label for="textqr" class="m-2">Tamaño</label>

  <button type="submit" class="m-2 btn btn-primary">Generar</button>

  </div>

</div>

<div class='col-md-6'>

  <div class='result'>

  </div>

</div>

</div>

</div>

</form>

Con Ajax recogeremos los datos ingresados por el usuario y los enviaremos a nuestra pagina que prosesará los datos y para que todo ocurra sin salir de la pagina del formulario

<script>

        $("#generador").submit(function(event) {

            var names = $("#names").val();

            var lastnames = $("#lastnames").val();

            var celular = $("#celular").val();

            var telefono = $("#telefono").val();

            var correo = $("#correo").val();

            var organizacion = $("#organizacion").val();

            var direccion = $("#direccion").val();

            var url =$("#url").val();

            parametros = {

                "name": names,

                "lastname": lastnames,

                "celular": celular,

                "telefono": telefono,

                "correo": correo,

                "organizacion": organizacion,

                "url": url,

                "direccion":direccion

            };

            $.ajax({

                type: "POST",

                url: "generar.php",

                data: parametros,

                success: function(datos) {

                    $(".result").html(datos);

                }

            })

            event.preventDefault();

        });

    </script> 

Ahora veamos nuestro código php

Obtenemos de la siguiente forma todos los campos de nuestro formulario.

con $sizeqr=200; le daremos un tamaño a nuestro código QR.

    

$nombre=$_POST['name'];

$apellido=$_POST['lastname'];

$celular=$_POST['celular'];

$empresa=$_POST['organizacion'];

$direccion=$_POST['direccion'];

$email=$_POST['correo'];

$telefono=$_POST['telefono'];

$url=$_POST['url'];

$sizeqr=200;

Código que crea el contacto vcard

$mensaje="BEGIN:VCARD\n";

$mensaje.="VERSION:2.1\n";

$mensaje.="N;CHARSET=UTF-8;ENCODING=QUOTED-PRINTABLE:".$apellido.";".$nombre."\n";

$mensaje.="FN;CHARSET=UTF-8;ENCODING=QUOTED-PRINTABLE:".$nombre." ".$apellido."\n";

$mensaje.="ORG:".$empresa."\n";

$mensaje.="TEL;CELL;VOICE:".$celular."\n";

$mensaje.="TEL;Office:".$telefono."\n";

$mensaje.="EMAIL:".$email."\n";

$mensaje.="ADR: ".$direccion."\n";

$mensaje.="URL:".$url."\n";

$mensaje.="END:VCARD";

Llamaremos a nuestra librería a través de la siguiente linea

include('vendor/autoload.php');

use Endroid\QrCode\QrCode;

$qrCode = new QrCode($mensaje);

$qrCode->setSize($sizeqr);

$image= $qrCode->writeString();

 $imageData = base64_encode($image);

echo '<img src="data:image/png;base64,'.$imageData.'">';

Les dejo el código completo para que lo puedan descargar  entra a: https://github.com/joako1212/qr-con-vcard.git