最近在做一个自媒体账号查询的搜索引擎,其中有微信公众号部分,主要把公众号首页地址转为微信公众号可以识别的二维码,以方便用户添加自己关心的公众号。
本来想采集搜狗微信中的二维码,却发现二维码是临时的,时间长就无法使用了。故想到直接把微信历史文章页转为二维码,共用户扫码关注。
本文介绍 基于jquery.qrcode.min.js的二维码生成方法。同时把二维码转为图片,并把图片URL赋值到img标签的src属性。
最终实现的效果是:鼠标移动到二维码小图标上时,调用js方法,生成二维码并显示。
具体操作如下:
第一步引入js
第二步:构造HTML标签
<div id="divOne${row.id}"></div> <img class="qrcode" id='imgOne${row.id}' alt="微信二维码" /> <img id="${row.id}" onmouseover="bigImg(${row.id})" src="./ico_ewm.png">
由于需要给列表中的每一个公众号信息后面,均加上二维码。所以,id值需要设置不同
,这里使用imgOne+ID的格式来处理。
第三步:把URL转为canvas 二维码
//生成微信首页链接二维码
function bigImg(id,url) {
//默认使用Canvas生成,并显示到图片
var qrcode = $('#divOne' + id).qrcode(url)
.hide();
var canvas = qrcode.find('canvas').get(0);
var imageUrl = canvas.toDataURL('image/jpg');
$('#imgOne' + id).attr('src', imageUrl)
};