微信小程序 Canvas 动态生成二维码并保存到本地

简介: 微信小程序 Canvas 动态生成二维码并保存到本地

let drawQrcode = require("../../../utils/erweima.js");
// 生成二维码
draw() {

drawQrcode({
  width: 200, // 画出的二维码的宽高,单位为px
  height: 200,
  x:20, // 开始画的位置,x轴y轴
  y:20,
  canvasId: 'myQrcode', // 拿到canvas节点
  text: this.data.text // 文本数据
})
this.canvasToTempImage() // 画完之后获取临时路径

},

// 复制文本数据
clickCopy(e) {

var that = this;
wx.setClipboardData({
  data: that.data.text,
  success: function (res) {
    wx.showToast({
      title: '复制成功',
      icon: 'none'
    });
  }
});

},

// 获取二维码图片的临时路径
canvasToTempImage: function () {

var that = this;
wx.canvasToTempFilePath({
  canvasId: 'myQrcode',
  success: function (res) {
    var tempFilePath = res.tempFilePath;
    that.setData({
      imagePath: tempFilePath,
    });
  },
  fail: function (res) {
    console.log(res);
  }
});

},

// 下载图片
downloadCode: function (res) {

var filePath = this.data.imagePath
console.log('下载中' + filePath)
wx.saveImageToPhotosAlbum({
  filePath: filePath,
  success: function(res) {
    wx.showToast({
       title: '图片保存成功',
       icon: 'success',
       duration: 2000 //持续的时间
    })
  },
  fail: function (err) {
     console.log(err)
     wx.showToast({
     title: '图片保存失败',
     icon: 'none',
     duration: 2000//持续的时间
     })
  }
})

}

相关文章
|
4天前
|
前端开发 小程序
微信小程序canvas画布绘制base64图片并保存图片到相册中
微信小程序canvas画布绘制base64图片并保存图片到相册中
|
4天前
|
前端开发 小程序
微信小程序绘制canvas时在不同 设备上的大小不同的问题
微信小程序绘制canvas时在不同 设备上的大小不同的问题
118 0
|
6月前
|
小程序 程序员 开发工具
小程序生成二维码海报的组件-wxa-plugin-canvas
小程序生成二维码海报的组件-wxa-plugin-canvas
59 0
|
4天前
|
前端开发 小程序
微信小程序canvas画布绘制;canvas画布图片保存
微信小程序canvas画布绘制;canvas画布图片保存
46 0
|
8月前
|
编解码 前端开发 小程序
微信小程序canvas画布不清晰解决方法
微信小程序canvas画布不清晰解决方法
|
9月前
|
前端开发 小程序
微信小程序canvas画布绘制base64图片并保存图片到相册中
微信小程序canvas画布绘制base64图片并保存图片到相册中
136 0
|
9月前
|
前端开发 小程序
微信小程序canvas绘制完毕后如何保存
微信小程序canvas绘制完毕后如何保存
|
4天前
|
小程序 前端开发 API
微信小程序全栈开发中的异常处理与日志记录
【4月更文挑战第12天】本文探讨了微信小程序全栈开发中的异常处理和日志记录,强调其对确保应用稳定性和用户体验的重要性。异常处理涵盖前端(网络、页面跳转、用户输入、逻辑异常)和后端(数据库、API、业务逻辑)方面;日志记录则关注关键操作和异常情况的追踪。实践中,前端可利用try-catch处理异常,后端借助日志框架记录异常,同时采用集中式日志管理工具提升分析效率。开发者应注意安全性、性能和团队协作,以优化异常处理与日志记录流程。
|
4天前
|
小程序 安全 数据安全/隐私保护
微信小程序全栈开发中的身份认证与授权机制
【4月更文挑战第12天】本文探讨了微信小程序全栈开发中的身份认证与授权机制。身份认证包括手机号验证、微信登录和第三方登录,而授权机制涉及角色权限控制、ACL和OAuth 2.0。实践中,开发者可利用微信登录获取用户信息,集成第三方登录,以及实施角色和ACL进行权限控制。注意点包括安全性、用户体验和合规性,以保障小程序的安全运行和良好体验。通过这些方法,开发者能有效掌握小程序全栈开发技术。

热门文章

最新文章