微信小程序生成带参数二维码 (支持下载)

1,插件 weapp-qrcode 

使用方法:

!!! 这里宽高需要和canvas设置一样 小程序使用rpx需要转换为px单位

<canvas canvas-id="myQrcode"></canvas>
  drawQrcode({
          width: 200,
          height: 200,
          canvasId: 'myQrcode',
          text: message,
          callback: function (e) { 
            resolve()
           }
        }
        )

 2,使用微信小程序方法获取path

!!! 可能会获取不到在此方法外层加定时器

使用 api :

wx.canvasToTempFilePath()

wx.canvasToTempFilePath({       // setTimeout(() => {},0)
          canvasId: 'myQrcode', // 此处为canvas ID name
          success: function (res) {
            var tempFilePath = res.tempFilePath;
            that.setData({
              imagePath: tempFilePath,
            });
          },
          fail: function (res) {
            console.log(res);
          }
        })

3,保存到本地

前置微信保存方法只会调起一次授权,后置解决授权问题引导客户自行授权打开

使用api :

 wx.saveImageToPhotosAlbum    ()

 wx.getSetting ()

wx.openSetting ()

wx.showModal ()

 saveImg() {
    let that = this
      wx.getSetting({
        success(res) {
          // 判断用户是否已经授权了保存图片的权限
          if (res.authSetting['scope.writePhotosAlbum'] === undefined) {
            // 第一次运行,授权未定义,可以直接保存,系统会一次性询问用户权限
            that.saveCode();
          }else if (!res.authSetting['scope.writePhotosAlbum']) {
            // 用户没有授权,提示用户进行授权
            wx.showModal({
              title: '提示',
              content: '需要保存图片到相册,请授权。',
              success: function (modalRes) {
                if (modalRes.confirm) {
                  // 用户点击确定,跳转到设置页面
                  wx.openSetting({
                    success(settingRes) {
                      if (settingRes.authSetting['scope.writePhotosAlbum']) {
                        // 如果用户已经授权,执行保存图片的操作
                        that.saveCode();
                      } else {
                        // 用户没有授权,提示用户授权
                        wx.showToast({
                          title: '授权失败,请重新授权',
                          icon: 'none'
                        });
                      }
                    }
                  });
                } else {
                  // 用户取消,提示用户相关操作
                  wx.showToast({
                    title: '保存图片失败,请授权后再试',
                    icon: 'none'
                  });
                }
              }
            });
          } else {
            // 用户已经授权,直接保存图片
            that.saveCode();
          }
        }
      });
  }
  saveCode() {
    const qrCodeUrl = this.data.imagePath
    if (!qrCodeUrl) {
      wx.showToast({
        title: '二维码未生成',
        icon: 'none',
      });
      return;
    }
     // 保存二维码到本地相册
     wx.saveImageToPhotosAlbum({
      filePath: qrCodeUrl,
      success: function() {
        wx.showToast({
          title: '二维码已保存',
        });
      },
      fail: function(err) {
        wx.showToast({
          title: '保存失败',
          icon: 'none',
        });
        console.error(err);
      },
    });
  },

此方法仅作参考如有问题评论区留言!!!!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值