微信小程序分享图片给微信好友(如二维码)


目录

前言

一、使用哪种api?

二、对图片的处理需要转化为临时路径

三、Windows端兼容性问题

前言

最近在公司开发一个微信小程序项目,用到的uniapp技术,在分享图片时,查看了uniapp的技术文档,写的还是很粗糙的,说得不太清楚,在我看了一个下午得出了一个结论,uniapp并没有封装可以转发图片到微信好友中的api。


提示:以下是本篇文章正文内容,下面案例可供参考

一、使用哪种api?

1. 分享图片功能, 使用的是 wx.showShareImageMenu() 而不是uniapp的uni.share() 。

wx.showShareImageMenu({  //分享给朋友
                     path: qrimg.value,
                     success: (res) => {
                         console.log("分享成功:", res);
                     },
                     fail: (err) => {
                         console.log("分享取消:", err);
                     },
                 })

二、对图片的处理需要转化为临时路径

2. 分享的图片,如果是后端直接返回路径,需将路径转换为临时路径传入; 如果是前端生成图片,直接通过 wx.createCanvasContext() 画一个, 然后通过 canvasToTempFilePath 转成图片临时路径。

uni.canvasToTempFilePath({
                   destWidth: 100,
                   destHeight: 100,
                   canvasId: 'qrcode',
                   success: function(res) {
                         // 在H5平台下,tempFilePath 为 base64
                         // qrimg.value=res.tempFilePath
                         resolve(res.tempFilePath)
                   },
                   fail: function(error) {
                         wx.showToast({
                                 title: "保存图片失败",
                                 duration: 2000
                         })
                         if (error.errMsg === "saveImageToPhotosAlbum:fail:auth denied" || 
                             error.errMsg === "saveImageToPhotosAlbum:fail auth deny" || 
                             error.errMsg === "saveImageToPhotosAlbum:fail authorize no response"
                         ) {
                             // 这边微信做过调整,必须要在按钮中触发,因此需要在弹框回调中进行调用
                             wx.showModal({
                                 title: '提示',
                                 content: '需要您授权保存相册',
                                 showCancel: false,
                                 success: modalSuccess => {
                                     wx.openSetting({
                                         success(settingdata) {
                                             console.log("settingdata", settingdata)
                                             if (settingdata.authSetting['scope.writePhotosAlbum']) {
                                                 wx.showModal({
                                                     title: '提示',
                                                     content: '获取权限成功',
                                                     showCancel: false,
                                                 })
                                             } else {
                                                 wx.showModal({
                                                     title: '提示',
                                                     content: '获取权限失败,将无法保存到相册哦~',
                                                     showCancel: false,
                                                 })
                                             }
                                         },
                                     })
                                 }
                             })
                             reject(error)
                         }
                         reject(error)
                   }
                 })

三、Windows端兼容性问题

3. 用Windows电脑端微信,打开当前小程序,会发现,调用 wx.showShareImageMenu() 无反应( success、fail 方法都没执行),经咨询,showShareImageMenu方法不支持在Windows上使用, 因此需要提前判断是否是Windows系统(通过判断 getSystemInfoSync().platform 是否等于 windows ),如果是Windows系统,要么隐藏入口,要么toast给提示,来避开此问题


  • 2
    点赞
  • 20
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 4
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

因忍而解

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值