html：
<div class="posterDiv" id="posterBody">
<img class="top hidden" id="topImg" src="/h5demo-green/image/activity/top_.jpg" alt="">
<img class="erweima hidden" id="erweimaImg" src="" alt="">
<img class="bottom hidden" id="bottomImg" src="/h5demo-green/image/activity/bottom_.jpg" alt="">
<div id="canvas1" style="width: 140px;height: 140px;display: none"></div>
<canvas id="myCanvas" class="myCanvas"></canvas>
<img src="" alt="" id="save_img">
<div class="down">长按转发或保存<a class="downBt hidden" ></a></div>
</div>
<script src="/js/zepto.min.js"></script>
<script src="/js/qrcode.min.js"></script>
<script src="/js/poster.js"></script>
++++++++++++++++++++++++++++
重点来了。poster.js代码如下
先解释一下思路，
第一步：先调用qrcode.min.js，把扫码二维码需要跳转的链接（如我的代码中的‘http://www.baidu.com’），生成一个二维码，把二维码转成canvas格式（如我的代码中的canvas1）。
第二步：把这个canvas1转成img图片
第三步：把这个img重新画在一个新的canvas上，（如我的代码中的myCanvas）
第四步：把这个myCanvas转成img图片，大功告成！！！
此时生成的图片，是带有二维码的图片，在微信中，包括服务号，包括聊天窗口，都可以长按保存到本地相册，都可以长按识别二维码，都可以长按分享到微信朋友或者微信聊天群！！！！
window.onpageshow = function() {
var url='http://www.baidu.com'; //扫码二维码跳转的链接
makeCode(url,function () {
createErWei(function () {
createCanvas(‘小明’,‘001’);
})
});
};
function makeCode (erweiUrl,callback) {
var qrcode = new QRCode('canvas1', {
width: 200,
height:200,
});
qrcode.makeCode(erweiUrl);
if(callback){
window.setTimeout(function () {
callback();
},500);
}
}
function createErWei(callback) {
var can1=GLOBAL_G.getId('canvas1').getElementsByTagName('img')[0].src;
GLOBAL_G.getId('erweimaImg').src=can1;
if(callback){
window.setTimeout(function () {
callback();
},200);
}
}
function createCanvas(name,adminId){
var deviceWidth = document.documentElement.clientWidth;
var stageScale=deviceWidth/750;
var c=document.getElementById("myCanvas");
c.width = 670*stageScale;
c.height = 1086*stageScale;
c.style.display='none';
var ctx=c.getContext("2d");
var img = GLOBAL_G.getId('topImg'),
imgW=img.width*stageScale,
imgH =img.height*stageScale;
ctx.drawImage(img,0,0,imgW,imgH);
var img3 = GLOBAL_G.getId('bottomImg'),
imgW3=img3.width*stageScale,
imgH3=img3.height*stageScale;
ctx.drawImage(img3,0,imgH,imgW3,imgH3);
var img2=GLOBAL_G.getId('erweimaImg');
img2.width=200*stageScale;
img2.height=200*stageScale;
var imgW2=img2.width,
imgH2 =img2.height;
ctx.drawImage(img2,10,imgH+10,imgW2,imgH2);
ctx.fillStyle="#000";
ctx.font="16px Arial";
var x1=234*stageScale,y1=(762+38)*stageScale;
tempSrc = c.toDataURL();
var newImg = document.getElementById("save_img");
newImg.src=tempSrc;
}
