用Jquery-qrcode制作二维码时需要保存二维码图片进行进一步的修饰。由于二维码是用js前台自动生成的，所以后台不能直接获取。找了一下资料，决定将二维码图片的数据用ajax传回后台，在保存成图片。
Jquery-qrcode制作二维码分canvas和tabel两种方式
一、Canvas方式生成的二维码直接渲染在canvas内，可以直接用toDataURL()传回，并在后台获取二维码数据
前台代码
function ajax_post(){ var url = document.getElementById(“output”).childNodes[0].toDataURL(“image/png”);//$(’#output’).toDataURL(“image/png”); $.post(“action.php”,{imageurl:url}, function(data){ document.getElementById(“test”).innerHTML = data; }, “text”); }
后台代码
<?php $url = $_POST["imageurl"]; $img = file_get_contents($url); file_put_contents('1.gif',$img); echo 'ok'; ?>二、tabel方式生成的二维码是将二维码转化成一个表格，每个单元格作为二维码的一个像素点，通过改变单元格的背景色来汇聚成一个二维码
研究了很久，实在找不到相关的保存资料，看了一下代码，发现这种二维码只用到五种颜色，于是便自己搞了一个解决方案：
用数字0-5代表每一种颜色，然后将整个二维码的数据序列以字符串的方式传回后台，后台获取到之后用GD库自制一张二维码
前台代码
function ajax_post(){ var data = “”;//var data = new Array(); var trs = $(’#output’).find(‘tr’); var width = trs[0].style.height; trs.each(function (j) { tds = $(this).find(‘td’); //data[index] = “”; tds.each(function (i) { var colorNum = 5; switch(this.style.backgroundColor) { case ‘blue’: colorNum = 0; break; case ‘red’: colorNum = 1; break; case ‘grey’: colorNum = 2; break; case ‘green’: colorNum = 3; break; case ‘yellow’: colorNum = 4; break; } data = data + colorNum;//data[index] = data[index] + colorNum;//this.style.backgroundColor; }); data = data + “-”; }); //alert(data); //alert(data[1].length);//41
$.post(“action.php”,{imageData:data, widthData:width}, function(data){ document.getElementById(“test”).innerHTML = data; }, “text”);//这里返回的类型有：json,html,xml,text }
后台代码
<?php $data = $_POST["imageData"]; $len = floatval($_POST["widthData"]); // 创建300X300画布 $im = imagecreatetruecolor(300, 300); // 颜色 $blue = imagecolorallocate($im, 0, 0, 255); $red = imagecolorallocate($im, 255, 0, 0); $grey = imagecolorallocate($im, 128, 128, 128); $green = imagecolorallocate($im, 0, 128, 0); $yellow = imagecolorallocate($im, 255, 255, 0); $color = array($blue, $red, $grey, $green, $yellow); // 填充画布 //$len = 7.317073170731708; $dataLen = strlen($data); for($index = $i = $j = 0; $index < $dataLen; $index++, $i++) { $x1 = $i * $len; $y1 = $j * $len; $x2 = $x1 + $len; $y2 = $y1 + $len; $color = $blue; switch(substr($data, $index, 1)) { case '0': break; case '1': $color = $red; break; case '2': $color = $grey; break; case '3': $color = $green; break; case '4': $color = $yellow; break; case '-': $j++; $i = -1; $color = 'N'; break; } if($color != 'N')imagefilledrectangle($im, $x1, $y1, $x2, $y2, $color); } // 生成图片 imagepng($im, '1.png'); // 释放内存 imagedestroy($im); echo 'ok'; ?>作者：HBLo 来源： 原文：https://blog.csdn.net/u012418896/article/details/44021351 版权声明：本文为博主原创文章，转载请附上博文链接！
