1. 사용된 클래스 라이브러리
1. phpqrcode(php 라이브러리)
2. qrcode.js(자바스크립트 라이브러리)
2.phpqrcode 사용
PHP 클래스 라이브러리만 사용합니다. 즉, QR 코드 생성이 백그라운드에서 수행됩니다. 배경에 로고가 있는 QR 코드를 생성하려면 먼저 로고 이미지를 서버에 업로드해야 합니다. (저는 웹업로더를 사용하여 업로드했습니다.)
phpqrcode 사용 방법:
먼저 phpqrcode를 다운로드하세요: http://phpqrcode.sourceforge.net/
그런 다음 사용하기 전에 phpqrcode.php 파일을 소개하는 것을 잊지 마세요
$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. qrcode.js 사용
프론트 엔드에서 QR 코드를 직접 생성하려면 qrcode.js를 사용하세요. 먼저 jquery.qrcode.js를 다운로드해야 합니다
qrcode 사용 방법도 매우 간단합니다.
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') //二维码中间的图片 });
jquery.qrcode.js를 도입하고 이 js 코드를 직접 작성하면 실행 후 QR 코드가 표시되고 처리될 수 있습니다
주로 QR 코드 중간에 있는 로고 참조 형식입니다. 일반적으로 로컬 이미지를 촬영하는 데는 두 가지 형식이 있습니다. 하나는 로컬 URL이고 다른 하나는 이미지를 base64 형식으로 변환하는 것입니다.
처음에는 이미지를 참조하기 위해 로컬 URL 형식을 사용해 보았지만 js 파일과 동일한 디렉터리에 있는 이미지만 참조할 수 있다는 것을 알고 로컬 URL 형식은 지원하지 않아 후자의 방법을 채택했습니다.
사용
236077703fcea6991e81d5305adbee72
로컬 이미지를 업로드하고 선택한 다음 base64 형식을 사용하려면
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 } }
파일을 데이터 URL 문자열의 문자열로 읽고, 작은 파일을 특수 형식의 URL 주소가 포함된 페이지로 직접 읽어옵니다. 이 특수 형식은 base64입니다
3. 두 클래스 라이브러리 비교
두 개의 클래스 라이브러리가 있는데, 하나는 백그라운드에서 작동하고 다른 하나는 프런트 엔드에서 직접 작동합니다.
phpqrcode는 QR코드를 생성하여 백그라운드에서 동작하며, 생성된 이미지는 서버에 저장됩니다. 일반적으로 생성된 QR코드는 로컬에 바로 저장되었다가 직접 서버에 가서 다시 얻어오는 경우가 거의 없기 때문에 phpqrcode를 사용하게 되면 서버에 이미지가 쌓여서 불필요한 공간을 차지하게 됩니다. , 삭제하면 추가 비용이 발생합니다. 따라서 phpqrcode를 사용하는 것은 이 QR 코드 생성 도구에 적합하지 않습니다. 게다가 이미지를 업로드하면 추가 오버헤드도 발생합니다
qrcode.js는 프런트엔드에서 직접 작동하며, 이미지를 업로드하고 브라우저에 직접 저장하며, 배경 간섭 없이 프런트엔드에서 직접 QR 코드를 생성합니다. 이를 통해 불필요한 오버헤드가 줄어들고 이미지 손상이 발생하지 않습니다. 서버를 쌓아서 불필요한 공간을 차지합니다.