uniapp app微信授权登录
时间: 2025-01-31 12:18:09 浏览: 44
### UniApp 实现微信授权登录
#### 后端配置
为了使UniApp能够成功处理来自微信用户的授权请求,后端需进行适当设置。这包括但不限于创建服务接口来接收前端发送过来的临时票据(code),并通过此code向微信服务器换取访问令牌(access_token),进而获取用户基本信息[^1]。
```javascript
// Node.js 示例代码片段用于交换 access token 和 openid
const axios = require('axios');
async function getAccessToken(code) {
const appId = 'your_app_id';
const appSecret = 'your_app_secret';
try {
let response = await axios.get(`https://api.weixin.qq.com/sns/oauth2/access_token?appid=${appId}&secret=${appSecret}&code=${code}&grant_type=authorization_code`);
return response.data;
} catch (error) {
console.error(error);
throw new Error("Failed to fetch access token");
}
}
```
#### 授权流程概述
在准备工作中提到,开发者需要先拥有已注册并认证过的微信公众号,在公众平台上完成必要的开发环境搭建工作,比如设定合法域名和服务端地址等。当一切就绪之后,可以通过调用微信JS-SDK的方法`wx.login()`发起登录行为;接着利用获得的code参数去请求自己的API接口以继续后续操作[^2]。
```javascript
// 在页面加载时尝试自动登录
onLoad() {
uni.login({
provider: 'weixin',
success: async (loginRes) => {
// 使用 loginRes.code 进行下一步验证...
// 发送 code 至后台 API 获取 session_key 及其他信息
const res = await this.$http.post('/auth/wechat', { code: loginRes.code });
if (!res.errMsg) {
// 存储返回的数据到本地存储或其他地方供以后使用
uni.setStorageSync('sessionKey', res.session_key);
// 更新当前页面状态或重定向至主页
}
},
fail(err){
console.log('Login failed:', err);
}
})
},
```
#### 完整授权过程说明
整个授权过程中涉及到多个环节之间的交互,从前端触发登录动作开始直到最终取得用户资料结束。具体来说就是:
- 用户点击按钮触发 `uni.login()` 方法;
- 成功后得到一个临时凭证 `code` 并将其传递给自定义的服务端逻辑;
- 服务端拿着这个 `code` 请求微信官方接口拿到真正的会话密钥(session key)以及open ID;
- 利用这些信息再次查询更详细的个人信息如昵称、头像链接等等[^4]。
阅读全文
相关推荐

















