标签：otc 方式 idt string bsp xxxx 常见问题 纠错 生成
最近做一个活动，需要前端生成截图，用到了html2canvas，但是其中有个致命的问题是，活动生成的图片中要求需要一个动态的二维码
最初的活动是固定的二维码，所以生成没有问题，动态的二维码涉及到跨域等问题，无法在生成的图片中呈现
于是想到了利用前端canvas方式方式构建一个二维码画布，html2canvas也是画布的方式理论上可以完美契合
在网上搜索一番之后发现还真有这样的工具，选择了比较常见的方式，jquery.qrcode
插件
前提引入了jquery，在引入
<script src="https://cdn.bootcdn.net/ajax/libs/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>
一个纯浏览器 生成 QRcode 的 jQuery 插件，使用非常简单，生成的 QRcode 无需下载图片，并且不依赖第三方服务，插件压缩之后大小小于 4K。
参数
text : "xxxxx" //设置二维码内容
render : "canvas",//设置渲染方式 （有两种方式 table和canvas，默认是canvas）
width : 256, //设置宽度
height : 256, //设置高度
typeNumber : -1, //计算模式
correctLevel : 0,//纠错等级
background : "#ffffff",//背景颜色
foreground : "#000000" //前景颜色
使用
1.创建一个用于包含 QRcode 图片的 DOM 元素，比如 div：<div id="qrcode"></div>
2.通过下面代码生成 QRcode：
最简单方式：jQuery(‘#qrcode‘).qrcode("xxxxxxxxxx");
自定义方式：jQuery(‘#qrcode‘).qrcode({render:canvas,width: 64,height: 64,correctLevel:0,text: "xxxxxxxxxxxx"});
常见问题
1.在chorme浏览器中二维码生成成功后无法扫描解决方法：
//改成使用table的渲染方式，亲测支持各种各版本的浏览器 jQuery(‘#qrcode‘).qrcode({width: 200,height: 200,correctLevel:0,render: "table",text: "xxxxxxxxxxxx"});
2.在微信或手机浏览器中生成的二维码无法扫描解决方法；
//改成使用默认的渲染方式，支持微信和QQ内置浏览器及其它手机浏览器 jQuery(‘#qrcode‘).qrcode({width: 200,height: 200,correctLevel:0,text: "xxxxxxxxxxxx"});
作者：旧旧的 <393210556@qq.com> 解决问题的方式，就是解决它一次
标签：otc 方式 idt string bsp xxxx 常见问题 纠错 生成
原文地址：https://www.cnblogs.com/widgetbox/p/12941848.html
