Summary of how to generate QR code with logo in php_php skills

1. Class libraries used

1. phpqrcode (php library)

2. qrcode.js (javascript library)

2. Use of phpqrcode

Only uses the PHP class library, that is, the generation of QR codes is operated in the background. Because you want to generate a QR code with a logo in the background, you must first upload the logo image to the server (I used webuploader for uploading)

How to use phpqrcode:

First download phpqrcode: http://phpqrcode.sourceforge.net/

Then remember to introduce the phpqrcode.php file before using it

$value = $url;//二维码内容 
$errorCorrectionLevel = 'L';//设置容错级别 
$matrixPointSize = $size;//生成图片大小 
QRcode::png($value, 'public_files'.DIRECTORY_SEPARATOR .'code'.DIRECTORY_SEPARATOR .'qrcode.png', $errorCorrectionLevel, $matrixPointSize, 2);//生成二维码图片 无logo
$logo = $tar_path;//上传至服务器的logo图片 
$QR = 'public_files'.DIRECTORY_SEPARATOR .'code'.DIRECTORY_SEPARATOR .'qrcode.png';//已经生成的原始二维码图
 
if ($logo !== FALSE) {
  $QR = imagecreatefromstring(file_get_contents($QR));
  $logo = imagecreatefromstring(file_get_contents($logo));
  $QR_width = imagesx($QR);//二维码图片宽度
  $QR_height = imagesy($QR);//二维码图片高度
  $logo_width = imagesx($logo);//logo图片宽度
  $logo_height = imagesy($logo);//logo图片高度
  $logo_qr_width = $QR_width / 5;
  $scale = $logo_width/$logo_qr_width;
  $logo_qr_height = $logo_height/$scale;
  $from_width = ($QR_width - $logo_qr_width) / 2;
  imagecopyresampled($QR, $logo, $from_width, $from_width, 0, 0, $logo_qr_width,
    $logo_qr_height, $logo_width, $logo_height);
}
$name = time();
imagepng($QR, 'public_files'.DIRECTORY_SEPARATOR .'code'.DIRECTORY_SEPARATOR .$name.'.png');//输出带logo的二维码图片

3. Use of qrcode.js

Use qrcode.js to directly generate QR codes on the front end. You first need to download jquery.qrcode.js

The use of qrcode is also very simple:

var length = size*80;//设置二维码大小
length = parseInt(length);
$("#code_img").qrcode({ //code_img是一个img标签的id
  render : "canvas",  //设置渲染方式，有table和canvas，使用canvas方式渲染性能相对来说比较好
  text : url,  //扫描二维码后显示的内容,可以直接填一个网址，扫描二维码后自动跳向该链接
  width : length,       //二维码的宽度
  height : length,
  background : "#ffffff",    //二维码的后景色
  foreground : "#000000",    //二维码的前景色
  src: $('#image').attr('src')       //二维码中间的图片
});

Introduce jquery.qrcode.js and then write this js code yourself. After execution, the QR code can be displayed and processed

Mainly the logo reference format in the middle of the QR code. Generally, there are two formats for taking local images: one is the local URL, and the other is to convert the image into base64 format

At first, I tried the local URL format to reference images, but found that I could only reference images in the same directory as the js file, so the local URL format was not supported, so I adopted the latter method.

Use

To upload and select a local image, and then take its base64 format

var input = document.getElementById("file_input");
 
if(typeof FileReader==='undefined'){
  input.setAttribute('disabled','disabled');
}else{
  input.addEventListener('change',readFile,false);
}
 
function readFile(){
  var file = this.files[0];
  if(!/image\/\w+/.test(file.type)){
    alert("文件必须为图片！");
    return false;
  }
  var reader = new FileReader();
  reader.readAsDataURL(file);
  reader.onload = function(e){
    $('#image').attr('src',this.result);//image为img标签的id
  }
}

Read the file as a string of Data URL strings, and read the small file directly into the page with a URL address in a special format. This special format is base64

3. Comparison between the two class libraries

Two class libraries, one operates in the background and the other operates directly in the front end.

phpqrcode generates QR codes and operates in the background, and the generated images are saved on the server. Generally, the generated QR code is saved directly to the local and then used directly. It is rare to go to the server to obtain it for a second time. Therefore, using phpqrcode will cause the images in the server to accumulate, occupying unnecessary space, and deleting them will also cost extra money. overhead. So using phpqrcode is not suitable for this QR code generation tool. Moreover, uploading images will also incur extra overhead

qrcode.js operates directly on the front-end, uploads images and saves them directly in the browser, and generates QR codes directly on the front-end without any background interference. This reduces unnecessary overhead and does not cause image corruption on the server. Stack up and take up unnecessary space.