koa2实现微信授权登录

文章目录

        • oauth2.0协议工作原理
        • 授权登录准备和思路
          • 准备工作
          • 微信登录的两种方式:
          • 两种账号体系方式
        • koa2实现微信公众号登录


oauth2.0协议工作原理

koa2实现微信授权登录_第1张图片
token有两种,access和refresh ,token的有效期很短,如果想将有效期变长,可以请求一个地址去刷新token

授权登录准备和思路

准备工作
  • 正式环境:申请微信公众号和备案域名
  • 开发环境:准备花生壳/ngrok/natapp ( 访问内网环境的服务 )

测试账号配置: 微信网页授权
1·、登录公众号—>开发者工具—>公众号平台测试账号
koa2实现微信授权登录_第2张图片
koa2实现微信授权登录_第3张图片
appID和appsecret要放到node中使用
2、加入自己的微信号
koa2实现微信授权登录_第4张图片

3、输入域名
在这里插入图片描述
koa2实现微信授权登录_第5张图片

微信登录的两种方式:
  • 微信公众号授权登录(只能在公众号授权登录) https://mp.weixin.qq.com
  • 微信开发平台授权登录(功能比较多、扫码登录等)https://open.weixin.qq.com
两种账号体系方式
  • 自己系统没有账号体系,直接用微信账号作为自己的系统账号
  • 用微信账号授权,然后绑定自己系统账号

注意:
snsapi_userinfo 只有第一次访问才会弹出授权页面,已经授权后就不再需要了

koa2实现微信公众号登录

// 安装koa-generator
npm install koa-generator -g
  
// 创建一个名为server的项目
koa2  server  

cd  server  &&  npm  install

// 安装node自动重启工具
npm install -g nodemon

// 启动
nodemon bin/www

// index.js
const router = require('koa-router')()
const superagent = require('superagent') // 一个node环境http(s)请求中间件
const { query } = require('../db/db')
const APPID = 'wx524c7234498cfc11'
const appsecret = 'b845362de2514656ce5893a0f9f617ff'
const REDIRECT_URI = 'http://cff.natapp1.cc/wxcallback'

router.get('/', async (ctx, next) => {
  await ctx.render('index', {
    title: 'Hello Koa 2! sss'
  })
})

// 1、用户同意授权,获取code
router.get('/goLogin', async (ctx, next) => {
  let url = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + APPID +
    '&redirect_uri=' + REDIRECT_URI +
    '&response_type=code' +
    '&scope=snsapi_userinfo' +
    '&state=STATE#wechat_redirect'
  ctx.response.redirect(url) // 重定向到这个地址
})

// 2、通过code换取网页授权access_token
router.get('/wxcallback', async (ctx, next) => { /// wxcallback?code=011k2BDK1gY6T30Cl7DK1kaxDK1k2BD8&state=STATE
  let code = ctx.query.code
  let access_token = ''
  let openid = ''
  await superagent.get('https://api.weixin.qq.com/sns/oauth2/access_token?appid=' + APPID +
    '&secret=' + appsecret +
    '&code=' + code +
    '&grant_type=authorization_code')
    .then(res => {
      // 此处本来应该用res.body获取返回的json数据,但总是获取不到,只能用text代替
      let result = JSON.parse(res.text)
      access_token = result.access_token
      openid = result.openid
    })
    .catch(res => {
      console.log(res)
    })

  // 3、刷新access_token(如果需要)
  // 4、拉去用户信息
  let res = await superagent.get(
    'https://api.weixin.qq.com/sns/userinfo?access_token=' + access_token +
      '&openid=' + openid +
      '&lang=zh_CN')
  let info = JSON.parse(res.text)
  /*
     // 1种情况,是基于微信授权的账号作为本系统的账号体系来使用
     // 数据库查询语句
     let sqlStr = 'INSERT INTO tt_user (`nickname`) VALUES("' + info.nickname + '")'
     // 执行语句
     query(sqlStr, [], (error, results, fields) => {
       if (error) {
         console.log('INSERT ERROR - ', error.message)
         return
       }
       console.log('INSERT SUCCESS')
     })
     */

  // 2种情况,有账号体系,微信账号作为一个关联,来关联我们的账号体系
  // 2.1数据库查询语句
  // 根据openid查询是否有数据
  let sqlStr = 'SELECT * FROM tt_user where openid = "' + info.openid + '" '
  let result = await query(sqlStr)
  let sqlStr2
  if (result[0].openid == null) { // 数据库是否存在openid
    // 不存在openid,把信息插入表里
    sqlStr2 = 'INSERT INTO tt_user (`openid`,`sex`,`country`,`headimgurl`) VALUES("' + info.openid + '","' + info.sex + '","' + info.country + '","' + info.headimgurl + '")'
  } else {  // 存在openid
    // 存在就更新  nickname = "' + result.nickname + '" ,
    sqlStr2 = 'UPDATE tt_user SET headimgurl = "' + info.headimgurl + '" WHERE openid = "' + info.openid + '"'
  }
  query(sqlStr2, [], (error, results, fields) => {
    if (error) {
      console.log('INSERT ERROR - ', error.message)
      return
    }
    console.log('INSERT SUCCESS')
  })
  ctx.response.redirect('/home?openid=' + result[0].openid) // 重定向到这个地址
})

router.get('/home', async (ctx, next) => {
  // 根据openid查询数据库是否有手机号,没有就跳到注册页进行关联
  let openid = ctx.query.openid
  let sqlStr = "SELECT * from tt_user where openid = '" + openid + "'"
  let result = await query(sqlStr)
  let sqlStr2
  if (result[0].phone == null) {  // 不存在手机号
    ctx.response.redirect('/registe?openid=' + openid)
  } else { // 存在手机号   更新 微信名字、头像
    sqlStr2 = 'UPDATE tt_user SET nickname = "' + result[0].nickname + '" , headimgurl = "' + result[0].headimgurl + '" WHERE openid = "' + result[0].openid + '"'
    await ctx.render('home', {
      title: '欢迎登录'
    })
  }
  query(sqlStr2, [], (error, results, fields) => {
    if (error) {
      console.log('INSERT ERROR - ', error.message)
      return
    }
    console.log('INSERT SUCCESS')
  })
})

router.get('/registe', async (ctx, next) => {
  let openid = ctx.query.openid
  // 把openid、头像带过来
  await ctx.render('registe', {
    title: 'Hello Koa 2! sss',
    openid: openid,
    img: 'https://ucenter.51cto.com/images/noavatar_middle.gif'
  })
})

router.get('/regsave', async (ctx, next) => {
  let openid = ctx.query.openid
  let phone = ctx.query.phone
  let email = ctx.query.email

  // 根据openid把手机号、邮箱号更新到数据库
  let sqlStr = 'UPDATE tt_user  SET phone = "' + phone + '" , email = "' + email + '" WHERE openid = "' + openid + '"'
  query(sqlStr, [], (error, results, fields) => {
    if (error) {
      console.log('INSERT ERROR - ', error.message)
      return
    }
    console.log('INSERT SUCCESS')
  })

  await ctx.render('home', {
    title: '欢迎登录'
  })
})

module.exports = router

koa2实现微信授权登录_第6张图片
在这里插入图片描述

你可能感兴趣的:(node.js)