微信端有时候后台传入一段链接需要生成二维码展示给用户,而不是一段长链接。现在的人宁愿扫二维码也不愿意点击陌生的链接。
当后台传入连接时需要使用jquery-qrcode生成canvas二维码
官网参考:https://github.com/jeromeetienne/jquery-qrcode
用法:
<div id="scanPayImg"></div>
$("#scanPayImg").qrcode({
render: "canvas", //canvas方式
160, //宽度
height:160, //高度
text: ret.payRedirect //任意内容 //一般是某个网址或者某个链接
});
这里有个问题了,在微信端canvas是无法长按扫描的,因为不是个img文件。。。所以还要把canvas转换成img
//从 canvas 提取图片 image
function convertCanvasToImage(canvas) {
//新Image对象,可以理解为DOM
var image = new Image();
// canvas.toDataURL 返回的是一串Base64编码的URL,当然,浏览器自己肯定支持
// 指定格式 PNG
image.src = canvas.toDataURL("image/png");
return image;
}
var mycanvas1=document.getElementsByTagName('canvas')[0]; //获取网页中的canvas对象
//将转换后的img标签插入到html中
var img=convertCanvasToImage(mycanvas1);
$('#scanPayImg').html("");//移除已生成的避免重复生成
$('#scanPayImg').append(img);//imagQrDiv表示你要插入的容器id