小程序webview调用微信扫一扫的“曲折”思路

小程序webview调用微信扫一扫的“曲折”思路,第1张

自上一篇遇到 webview 中没有返回按钮之后,虽然跳出坑了。解决方案: 《小程序webview跳转页面后没有返回按钮完美解决方案》

做为一名面向搜索引擎开发的我,遇到问题的第一件事,当然是百度啊,Google啊!可是这种在过去都是无往不利的方法,突然失效了!翻遍整个浏览器,并且把整个互联网都翻了个底朝天,竟然“找不到”解决方案(很有可能是我搜索水平太差,没有精通面向搜索引擎开发这项技能)!

无奈之下,只得另寻他法。我在上一贺大篇文章中提到过,可以在 H5 页面使用 wx.miniProgram.navigateTo 方法跳转到小程序页面。所以,得好好的利用这个方法,搞点事情。

想想看,既然能跳转到小程序,而小程序本身调用扫一扫是非常方便的,只需要使用 wx.scanCode 即可。那么也就是说,当用户点击扫码 *** 作的时候。我们可以先跳转到小程序页面,在页面 onload 的时候,立马调用 wx.scanCode ,也就达到了点击 H5 页面按钮唤起扫码功能的效果。然后把扫码结果,通过设置 webview 的 url 参数的形式返回给 H5 页面,最后在 H5 页面处理扫码结果。整个流程分析下来,可以说是天衣无缝,非常完美,理论上来说,是完全成立的。接下来,【撸码--运行--看效果】一条龙服务。点赞手势准备好,我怕看完我接下来的 *** 作,芹蔽你们沉浸在其中,无法自拔而忘记点赞了。

特别注意 setTimeout 函数,如果不使用该方法进行延迟调用,在 IOS系统 中100%无法调起扫一扫,应该算是微信小程序的BUG,至于延迟多少,就自行测试了,这边延迟 500ms 。禅首竖

2.1、扫码成功的回调处理:重定向到页面中,并且携带miniType参数和result参数

2.2、扫码失败的回调处理:直接重定向到页面,并且不带任何参数

微信小程序可以通过调用微信原生扫一扫功能,卖坦实现扫一扫红包的功能。具体实现方式如下:

1. 在小程序中调用微信原生扫一扫接口 wx.scanCode,获取用户扫码后的信息。

2. 判断扫码信息是否符合要求,例如是否为指定格式的红包码。

3. 如果扫码信息符合中扮桐要求,调用微信原生支付接口 wx.requestPayment 进行支付。

需要注意的是,由于微信限制了小程序的红包功能,所以在小程序中实现红包功能需要调用微信原生支付接口进行支付。同时,开发者需要遵守微信的相关规定和政策,不得违缺租反微信公众平台的相关规定。

封装小程序获取手机号接口及按钮:

getPhoneNumber(e) {

    this.activeUser(e.detail.iv, e.detail.encryptedData)

  },

  activeUser(iv, encryptedData) {

    let url = app.globalData.URL + '/front/employeeInfo/activeUser'

 渣手旦   let openid = wx.getStorageSync('Openid')

    wx.request({

      url: url,

      data: {

        iv: iv,

       薯槐 encryptedData: encryptedData,

        openid: openid

      },

      success: function (res) {

        if (res.data.data) {

          wx.setStorage({

            key: 'active',

            data: res.data.data,

          })

        } else {

     如扰     wx.showToast({

            title: '没注册不能激活',

          })

        }

      }

    })

  }

<button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">获取手机号</button>

调用微信扫一扫功能:

<text bindtap="bx">报修</text>

bx:function(){

      wx.scanCode({

        success(res) {

          console.log(res)

        }

      })

    },


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/12326420.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-24
下一篇 2023-05-24

发表评论

登录后才能评论

评论列表(0条)

保存