美文网首页
小程序授权

小程序授权

作者: SIRengar | 来源:发表于2018-04-04 20:53 被阅读0次

大家好,我是IT修真院深圳分院第07期学员,一枚正直善良的web程序员。

今天给大家分享一下,修真院官网 JS-11任务中可能会使用到的知识点:


1.背景介绍


说到这,我们需要先了解一下微信小程序是啥?简单说,它就是一个可以实现之前只能是原生态APP可以实现的效果和功能。比如说,一些酷炫的页面与转场,一些可以直接和手机硬件交互的功能,录音啊,拍视频啊,调用手机的重力感应啊,GPS啊等等。

从目前来讲,APP比手机网页好,手机网页比电脑网页好。手机网页在电脑上看起来还行,但需要我们输入网址域名,这在电脑上还好操作,在手机上,简单是让人抓狂。

虽然APP在体验上非常突出,但需要安装,需要消耗流量,占用手机有限的桌面空间。这种麻烦程序,甚至超出了APP的优势本身。

从这里就能看出微信小程序的好处了

1,不用安装,即开即用,用完就走。省流量,省安装时间,不占用桌面;
2,体验上虽然没法完全媲美原生APP,但综合考虑还是更优;
3,对于小程序拥有者来说,开发成本更低,他们可以更多财力,人力,精力放在如何运营好产品,做好内容本身;
4,对于用户来说,相较于各种APP,微信小程序UI和操作流程会更统一。这也会降低用户的使用难度;
5,对于小程序拥有者来说,相较于原生APP,推广更容易更简单,更省成本。

2.知识剖析


2.1 授权


部分接口需要获得用户授权同意后才能调用。此类接口调用时:
如果用户未接受或拒绝过此权限,会弹窗询问用户,用户点击同意后方可调用接口;
如果用户已授权,可以直接调用接口;
如果用户已拒绝授权,则短期内不会出现弹窗,而是直接进入接口 fail 回调。请开发者兼容用户拒绝授权的场景。


获取授权信息

开发者可以使用 wx.getSetting 获取用户当前的授权状态。

wx.getSetting(OBJECT)获取用户的当前设置。
注:返回值中只会出现小程序已经向用户请求过的权限。

Object 参数说明:
success Function 不是必要 接口调用成功的回调函数,返回内容详见返回参数说明。

fail Function 否 接口调用失败的回调函数

complete Function 否 接口调用结束的回调函数(调用成功、失败都会执行)

success返回参数说明:
authSetting Object 用户授权结果,其中 key 为 scope 值,value 为 Bool 值,表示用户是否允许授权,详见 scope 列表

示例代码:

wx.getSetting({
  success: (res) => {
    /*
     * res.authSetting = {
     *   "scope.userInfo": true,
     *   "scope.userLocation": true
     * }
     */
  }
})

2.2 scope表


这里介绍8种:用户信息、地理位置、通讯地址、发票抬头、微信运动步数、录音功能、保存到相册、摄像头

用户信息

scope: scope.userInfo
对应接口 wx.getUserInfo

地理位置

scope:scope.userLocation
对应接口wx.getLocation, wx.chooseLocation

通讯地址

scope: scope.address
对应接口wx.chooseAddress

发票抬头

scope:scope.invoiceTitle
对应接口wx.chooseInvoiceTitle

微信运动步数

注:这里需要关注微信运动公众号,来获取用户的信息
scope:scope.werun
对应接口wx.getWeRunData

录音功能

scope:scope.record
对应接口 wx.startRecord

保存到相册

scope.writePhotosAlbum
wx.saveImageToPhotosAlbum, wx.saveVideoToPhotosAlbum

摄像头

scope.camera

3.常见问题


如果用户拒绝授权该怎么办?

4.解决方案


fail:function(){
        wx.showModal({
          title: '警告',
          content: '你点击了拒绝授权将无法显示你的位置信息,点击确定重新获取授权。',
          success: function(res){
            if(res.confirm) {
              wx.openSetting({
                success:(res) => {
                  if (res.authSetting["scope.userLocation"]){
                    wx.getLocation({
                      success: function(res) {
                        that.setData({
                          position: res
                        })
                      },
                    })
                  }
                }
              })
            }
          }
        })
      }

当用户拒绝授权时,弹出模态框来引导用户进入设置授权页面

5.编码实战


6.拓展思考

可以在什么地方安置获取授权的按钮?

比如在直播小程序中,可以设置当用户发表评论时,获取用户的头像信息和名称,然后调用发表。

7.参考文献


微信公共平台——授权:https://developers.weixin.qq.com/miniprogram/dev/api/authorize-index.html

用户拒绝授权CSDN:https://blog.csdn.net/qq_28189091/article/details/75417073

8.更多讨论


1、小程序如何实现双向绑定

可以先定义data,然后利用this.setData来更改data值,比如绑定到一个变量上,当变量更改,data也随着更改,实现双向绑定

2、小程序授权后能够实现的功能

比如获取当前位置信息来定位滴滴打车司机与顾客间的位置,或者是请求发票抬头,来快速生成电子发票。还可以利用微信运动步数来实现健康监控。

3、请求授权可以绑定在那些标签上

理论上都可以绑定,但最好是绑定在button上,比较直观,且方便重复点击

相关文章

  • 小程序授权弹窗

    作者:黄杰;标签:小程序 授权 需求 进入小程序首页,用户点击页面任意地方触发小程序授权弹窗,如果已授权则不触发弹...

  • 微信小程序定位测试小结

    一、小程序位置授权 1、开启授权小程序地理位置的权限; 2、拒绝授权小程序地理位置的权限。 二、修改小程序位置 1...

  • uniapp微信小程序授权登录及地理位置

    微信小程序授权官方说明文档 uniapp微信小程序授权登录 参考链接 uniapp微信小程序授权地理位置(打开ma...

  • 如何用好小程序的心机功能?|小程序问答#4

    Q 当小程序授权使用后,如何取消它的授权? 点开“发现”进入小程序列表,找到你想取消授权的小程序。点击右上角的“·...

  • 小程序授权

    Tips: wx.login相当于静默授权wx.getUserInfo会唤起用户授权弹框用户拒绝授权后的fallb...

  • 小程序授权

    大家好,我是IT修真院深圳分院第07期学员,一枚正直善良的web程序员。 今天给大家分享一下,修真院官网 JS-1...

  • 小程序授权

    文档:https://developers.weixin.qq.com/miniprogram/dev/frame...

  • 小程序授权

    小程序授权涉及3个接口-wx.getSettings获取当前用户的授权状态-wx.openSettings打开设置...

  • 小程序扫盲:哪里看小程序的授权

    在登录小程序、或者自己开发小程序时,都需要小程序授权,这样的微信小程序授权管理在哪里呢?别急,接下来就跟大家科普一...

  • 微信小程序报错request:fail url not in d

    小程序授权域名没有填写 去小程序后台填写即可

网友评论

      本文标题:小程序授权

      本文链接:https://www.haomeiwen.com/subject/cjulhftx.html