H5生成二维码及保存

1.引入qrcode.js;  链接

2.创建html结构

<div id="qrcode"></div>

3.生成二维码对象;

new QRCode(document.getElementById("qrcode"),url);

url就是后端给的下载地址路径;

示例:

 new QRCode(document.getElementById("qrcode"),{
            text: document.URL,//这个url就是生成二维码的访问路径
            width: 128,
            height: 128,
            colorDark : "#000000",
            colorLight : "#ffffff",
            correctLevel : QRCode.CorrectLevel.H
        });

前端a标签实现图片的下载 ;

给a标签加上 download="share.png",并将你的base64编码或者链接代替a标签的href属性;

<a download="share.png" href="你的base64编码/链接">下载图片</a>

Vue项目生成二维码稍微有点区别

1.安装并在组件中引用

npm install  qrcodejs2 --save

>>>组件中引用
import QRCode  from "qrcodejs2"

 2.dom结构

<div id="qrcode"></div>

3.生成二维码

 

 new QRCode("qrcode",{
                text: cont,//这个url就是生成二维码的访问路径
                width: 180,
                height: 180,
                render:"canvas",
                colorDark : "#ccc",   //二维码颜色
                colorLight : "#fff"   //二维码背景色
            });