wx.login 接口获得临时登录凭证 code,服务端验证code生成Token

功能描述

调用接口获取登录凭证(code)。通过凭证进而换取用户登录态信息,包括用户在当前小程序的唯一标识(openid)、微信开放平台账号下的唯一标识(unionid,若当前小程序已绑定到微信开放平台账号)及本次登录的会话密钥(session_key)等。用户数据的加解密通讯需要依赖会话密钥完成。

wx.login({
  success (res) {
    if (res.code) {
      //发起网络请求
      wx.request({
        url: 'https://example.com/onLogin',
        data: {
          code: res.code
        }
      })
    } else {
      console.log('登录失败!' + res.errMsg)
    }
  }
})

请添加图片描述

  1. 通过wx.login获取code
  2. 将code发送给我们自己的服务器
  3. 我们自己的服务器需要将appid+appsecret+code,三者结合到一起发送给微信服务器(appsecret的获取后面会说)
  4. 当微信服务器拿到appid+appsecret+code,会返回给我们的服务器一些信息包括session_key和openid
  5. 项目服务器将session_key和openid保存下来生成token并返回给客户端
  6. 客户端调把token保存下来,以后每一次发送请求必须携带token

AppID和appsecret获取

项目服务器端需要整合appid+appsecret+code三个信息,去微信服务器端换取session_key和openid,所以说我们需要一个微信服务区的接口

请求数据示例

GET https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code 

返回数据示例

{
"openid":"xxxxxx",
"session_key":"xxxxx",
"unionid":"xxxxx",
"errcode":0,
"errmsg":"xxxxx"
}

通过验证临时登录凭证code,生成Token

前端请求

wx.login({
  success: res => {
    // 发送 res.code 到后台换取 openId, sessionKey, unionId
    // 1. 拿到code
    console.log('code'+ res.code)
    const code = res.code
    // 2. 将code发送给服务器,这里就需要我们的接口了
    const token = wx.request({
      url: '/getopenid',
      data:code
    })
    // 3. 将token存入storge
    wx.setStorageSync('token', token);
  }
})

服务器端接口

router.get('/getopenid',async (ctx,next)=>{
  // 得到前台出来的code
  const code = ctx.query.code
  //整合三者
  const appId = '	wx43cf35f51c3f8fe9'
  const appSecret = 'a9001166ca156245dbbbd3709a062a64'

  const url = `https://api.weixin.qq.com/sns/jscode2session?appid=${appId}&secret=${appSecret}&js_code=${code}&grant_type=authorization_code`

  let result = await fly.get(url)
  const userinfo = result.data
  // 生成token(自定义登录状态),返回给前端
  const token = jwt.sign({user},'hahahae')
  ctx.body = token
})
  • 11
    点赞
  • 14
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
在微信小程序中,可以使用wx.login方法获取登录凭证code,并将该code发送给服务器进行登录验证。服务器验证成功后,可以返回一个用户标识token或session_key等信息,用于保存登录态。 要保存登录态,可以使用小程序的本地存储功能。可以使用wx.setStorage方法将token或session_key等信息存储到本地,并在后续的请求中使用。 以下是一个简单的示例: ```javascript // 获取登录凭证code wx.login({ success: res => { const code = res.code; // 将code发送给服务器进行登录验证 // 服务器验证成功后返回token或session_key等信息 // 假设服务器返回的信息存在res.data中 // 保存token或session_key到本地存储 wx.setStorage({ key: 'token', data: res.data.token }); }, fail: err => { console.error(err); // 处理错误 } }); ``` 在上面的示例中,我们使用wx.login方法获取登录凭证code,并将该code发送给服务器进行登录验证。假设服务器返回的信息存在res.data中,我们使用wx.setStorage方法将token存储到本地。 在后续的请求中,可以使用wx.getStorage方法获取本地存储的token,并将其添加到请求的header中,或者根据具体需求进行处理。 ```javascript // 发起带有token的请求 wx.getStorage({ key: 'token', success: res => { const token = res.data; // 发起请求时添加token到header中 wx.request({ url: 'https://api.example.com/data', header: { 'Authorization': 'Bearer ' + token }, success: res => { console.log(res.data); // 处理数据 }, fail: err => { console.error(err); // 处理错误 } }); }, fail: err => { console.error(err); // 处理错误 } }); ``` 在上述示例中,我们使用wx.getStorage方法获取本地存储的token,并在请求中添加到header中。这样可以在后续的请求中带上登录态信息,进行权限验证或其他操作。 请注意,由于本地存储是在用户手机上进行,可能会存在一定的安全风险。所以,对于敏感信息,建议使用加密或其他安全机制进行保护。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值