大家好，我是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上，比较直观，且方便重复点击

小程序授权