mq
miniprogram-qrcode
npm i miniprogram-qrcode
mq

miniprogram-qrcode

小程序码生成插件。

by 吃鱼的帆

1.0.3 (see all)License:MITTypeScript:Not Found
npm i miniprogram-qrcode
Readme

未标题-2.png

miniprogram-qrcode

碉堡了的小程序码生成插件。

  • 支持三种小程序码获取方式

  • 自动缓存access_token,过期后自动重新生成

  • 将小程序码合成到指定模板图片上功能已经迁移到 miniprogram-qrcode-image

正常情况下,批量生成100张需要62.556秒,平均每张需要0.62556秒,1万张大概需要 1.73小时批量示例代码

安装

npm install miniprogram-qrcode --save

使用

let miniprogramQrcode = require('miniprogram-qrcode')

let qrocode = new miniprogramQrcode({
  appId: 'your appid',
  appSecret: 'your appSecret'
});

Api List

getWxQrcodeInfo

二维码渲染函数,一共有三种生成模式。

  • createWXAQRCode
  • getWXACode
  • getWXACodeUnlimit

createWXAQRCode

获取小程序二维码,适用于需要的码数量较少的业务场景。通过该接口生成的小程序码,永久有效,有数量限制。 官方说明


let info = await qrocode.getWxQrcodeInfo({
  mode: 'createWXAQRCode',
  config: {
    path: 'pages/index/main', // [String] 扫码进入的小程序页面路径,最大长度 128 字节,不能为空
    width: 400, // [Number] 二维码的宽度,默认 430px,最小 280px,最大 1280px
  },
})

getWXACode

获取小程序码,适用于需要的码数量较少的业务场景。通过该接口生成的小程序码,永久有效,有数量限制。 官方说明


let info = await qrocode.getWxQrcodeInfo({
  mode: 'getWXACode',
  config: {
    path: 'pages/index/main', // [String] 扫码进入的小程序页面路径,最大长度 128 字节,不能为空
    width: 400, // [Number] 二维码的宽度,默认 430px,最小 280px,最大 1280px
    auto_color: false, // [Boolean] 自动配置线条颜色,如果颜色依然是黑色,则说明不建议配置主色调,默认 false
    line_color: {"r":"0","g":"0","b":"0"}, // [Object] auto_color 为 false 时生效,使用 rgb 设置颜色 例如 {"r":"xxx","g":"xxx","b":"xxx"} 十进制表示,默认全 0
    is_hyaline: false, // [Boolean] 是否需要透明底色,为 true 时,生成透明底色的小程序码,默认 false
  },
})

getWXACodeUnlimit

获取小程序码,适用于需要的码数量极多的业务场景。通过该接口生成的小程序码,永久有效,数量暂无限制。 官方说明


let info = await qrocode.getWxQrcodeInfo({
  mode: 'getWXACodeUnlimit',
  config: {
    scene: '', // [String] 最大32个可见字符,只支持数字,大小写英文以及部分特殊字符:!#$&'()*+,/:;=?@-._~,其它字符请自行编码为合法字符(因不支持%,中文无法使用 urlencode 处理,请使用其他编码方式)
    page: 'pages/index/main', // [String] 必须是已经发布的小程序存在的页面(否则报错),例如 pages/index/index, 根路径前不要填加 /,不能携带参数(参数请放在scene字段里),如果不填写这个字段,默认跳主页面
    width: 400, // [Number] 二维码的宽度,默认 430px,最小 280px,最大 1280px
    auto_color: false, // [Boolean] 自动配置线条颜色,如果颜色依然是黑色,则说明不建议配置主色调,默认 false
    line_color: {"r":"0","g":"0","b":"0"}, // [Object] auto_color 为 false 时生效,使用 rgb 设置颜色 例如 {"r":"xxx","g":"xxx","b":"xxx"} 十进制表示,默认全 0
    is_hyaline: false, // Boolean 是否需要透明底色,为 true 时,生成透明底色的小程序码,默认 false
  },
})

返回值格式

{
  code: 200, // 200: 成功,500:失败
  error: null, // 当出错的时候的错误信息
  image: [BufferArray] // 二维码buffer数组
}

关于调试

微信开发者工具

使用微信开发者工具可以进行模拟参数调试 QQ截图20181117104623.png

测试接口

这里我提供了一个测试接口,可以带参数生成线上的小程序码,用来调试

[get] http://wx.toolos.cc 参数

  • mode 必传 [createWXAQRCode | getWXACode | getWXACodeUnlimit] 之一

注意

  • 其他参数对应上面的文档的mode对应的参数,path 或者 page 需要 encodeURIComponent 一下
  • 目前小程序只有一个路径 pages/index/main
  • 线上服务器配置低

示例

http://wx.toolos.cc/?mode=createWXAQRCode&path=pages%2Findex%2Fmain

参数模式

createWXAQRCode & getWXACode

这两种生成的参数,生成二维码数量有限,参数直接跟在path路径后面,例如:

let info = await qrocode.getWxQrcodeInfo({
  mode: 'createWXAQRCode',
  config: {
    page: `pages/index/main?sgr=521314&i=loveyou`
  },
})

扫一扫查看结果,注:这是线上版本(我留了一个彩蛋)可以用来模拟调试,长按红色圈出区域两次即可调出控制套模拟

output-createWXAQRCode.png

Screenshot_2018-11-17-10-55-13-286_com.tencent.mm.png

getWXACodeUnlimit

这个可以生成无限个,但是只能携带有局限性的参数scene,在这里推荐一种解析方式 key:value-key:value

let info = await qrocode.getWxQrcodeInfo({
  mode: 'getWXACodeUnlimit',
  config: {
    page: `pages/index/main`,
    scene: 'i:loveyou-sgr:521314'
  },
})

output-getWXACodeUnlimit.png

解析示例

onLoad (query) {
  // scene 需要使用 decodeURIComponent 才能获取到生成二维码时传入的 scene
  this.scene = decodeURIComponent(query.scene)
  this.queryJson = JSON.stringify(query)

  // 尝试解析  scene 格式: shop:1-id:2

  try {
    let oneArr = this.scene.split('-')
    let twoJson = {}
    for(let i=0; i<oneArr.length; i++) {
      let target = oneArr[i].split(':')
      twoJson[target[0]] = target[1]
    }
    this.twoJson = JSON.stringify(twoJson)

  } catch(e) {
    this.twoJson = e
  }

},

在开发者工具中例如下面模拟 QQ截图20181117104623.png

请我喝杯咖啡,支持更多开源

1024.png

LICENSE

MIT

No alternatives found
No tutorials found
Add a tutorial
No dependencies found

Rate & Review

100
No reviews found
Be the first to rate