zoukankan      html  css  js  c++  java
  • QRcode.js 生成二维码

    github官方文档指路:https://github.com/soldair/node-qrcode#options
    QRcode方法介绍:
    image.png
    这里只介绍后三种常用方法的使用:

    1、toCanvas 顾名思义是讲二维码生成canvas
    用法实例:

    //1、引入QRcode.js
    <script src='qrcode.js'></script>
    //2、具体用法
     QRCode.toCanvas('二维码信息文本', {
                errorCorrectionLevel: "L",//容错率L(低)H(高)
                margin: 1,//二维码内边距,默认为4。单位px
                height: 200,//二维码高度
                 200,//二维码宽度
                scal: 177,
                color: {
                    dark: '#000', // 二维码背景颜色
                    // light: '#000' // 二维码前景颜色
                },
                rendererOpts: {
                    quality: 0.9
                }
            }).then(canvas => {
                console.log(canvas)
                document.getElementById('myqrcode').append(canvas)
            }).catch((err) => {
                console.log(err)
            })
    

    背景和前景颜色不可以相近,不然有的设备上会识别不出来二维码

    2、toDataURL()生成base64字符串
    用法实例:

    QRCode.toDataURL('sss', {
                errorCorrectionLevel: "L",
                margin: 1,
                height: 200,
                 200,
                type: "10",
                scal: 177,
                type: "10",
                color: {
                    dark: '#000', // 二维码背景颜色
                    // light: '#000' // 二维码前景颜色
                },
                rendererOpts: {
                    quality: 0.9
                }
            }).then(base64 => {
                console.log(base64);//base64字符串
            }).catch((err) => {
                console.log(err)
            })
    

    3、toString()生成svg二进制字符

     QRCode.toString('sss', {
                errorCorrectionLevel: "L",
                margin: 1,
                height: 200,
                 200,
                type: "10",
                scal: 177,
                type: "10",
                color: {
                    dark: '#000', // 二维码背景颜色
                    // light: '#000' // 二维码前景颜色
                },
                rendererOpts: {
                    quality: 0.9
                }
            }).then(canvas => {
                console.log(canvas)
                document.getElementById('myqrcode').append(canvas)
            }).catch((err) => {
                console.log(err)
            })
    

  • 相关阅读:
    Docker的安装、配置及其基本使用
    Java提升七:注解
    Java提升六:泛型
    Java提升五:反射与动态代理
    MySQL中如何将主键默认值设为UUID()
    图解Mybatis框架原理及使用
    Java提升四:Stream流
    Java提升三:函数式接口
    Java提升二:Lambda表达式与方法引用
    java提升一:内部类
  • 原文地址:https://www.cnblogs.com/angfl/p/10243886.html
Copyright © 2011-2022 走看看