uniapp开发小程序授权登入

Uniapp是一款跨平台的开发框架，能够同时开发小程序、H5、App等多个平台的应用。在开发小程序时，授权登陆是一个非常常见的需求。Uniapp也为我们提供了授权登陆的 API，下面将介绍一下授权登陆的原理和具体实现方法。

### 授权登陆的原理

在小程序中，用户的授权登陆通常都是通过微信官方提供的API来实现的。授权登陆的基本流程如下：

1.用户点击登陆按钮时，调用 wx.login()方法，该方法返回的是一个登录凭证 code。

2.使用 code 调用 wx.getUserInfo() 方法，该方法返回用户的基本信息。

3.通过微信服务端的接口对该用户进行登录验证，验证通过后返回用户的唯一标识 openId。

4.开发者可以将用户的 openId 存储到服务器上，方便后续调用。

### 授权登陆的实现步骤

1.在项目根目录中的 manifest.json 文件中配置微信小程序的 AppID。

```json

"mp-weixin": {

"appid": "你的AppID"

}

```

2.在页面中创建一个按钮，用于触发授权登陆。

```html

微信授权登陆

```

3.在页面的 JS 文件中编写授权登陆的代码，代码如下：

```javascript

onTap() {

//使用 uni.login() 获取 code

uni.login({

success: res => {

console.log(res.code)

//使用 uni.getUserInfo() 获取用户信息

uni.getUserInfo({

success: res => {

//将 code 和用户信息发送给后端程序

uni.request({

url: 'https://example.com/login',

data: {

code: res.code,

userInfo: res.userInfo,

},

success: res => {

console.log(res.data)

}

})

}

})

}

})

}

```

4.在微信公众平台中配置域名白名单，允许小程序访问你的服务器域名。

至此，授权登陆的功能已经完成。

需要注意的是，uniapp中的授权登陆 API 与微信小程序的授权登陆 API 有所不同。需要在使用时进行区分，避免出现问题。

总结：

授权登陆是小程序中非常常见的功能，uniapp也为我们提供了方便的授权登陆 API。通过授权登陆，我们可以获取到用户的唯一标识 openId，方便后续的业务开发。