关于前端:阿里的Nodejs框架midway接入第三方授权登陆

31次阅读

共计 2279 个字符,预计需要花费 6 分钟才能阅读完成。

前言

难易水平: 简略

背景

最近在写 闪调 想接第三方受权登陆,比方微信的扫码登陆。qq、github、钉钉等受权登陆, 大家必定在第三方网站用过其中之一。

它是基于 OAuth2.0 协定规范设计的,接过一家的,你会发现其余家的都一样。

理清逻辑

咱们拿微信的的整体流程举例。


1. 第三方发动微信受权登录申请,微信用户容许受权第三方利用后,微信会拉起利用或重定向到第三方网站,并且带上受权长期票据 code 参数;2. 通过 code 参数加上 AppID 和 AppSecret 等,通过 API 换取 access_token;3. 通过 access_token 进行接口调用,获取用户根本数据资源或帮忙用户实现基本操作。

上一张官网图

1、跳转到第三方受权页面。

首先得得让用户点击之后跳到一个去操作受权的页面, 或者内嵌。

比方这个

这个

2、用户受权, 带着 authCode 回调咱们后端接口

3、authCode 换取 token, token 获取用户信息,定向首页。

这一步后端写个接口, 用 authCode 换取 token, token 再获取用户信息,

而后解决本人的业务逻辑,重定向到首页,至此,登陆实现。

示例地址

http://st.mawenqing.net/api/u…

代码实现

咱们以 nodejs 的 midwayjs 框架为例

midwayjs 是阿里开源的面相将来的 nodejs 框架

midway 官网 http://www.midwayjs.org/

第三方受权用的钉钉, 原本想用微信,起初发现微信开放平台集体不好注册。

1、定向到受权页面

调登陆接口, 后端重定向到钉钉受权页面

于是须要一个后端的重定向的接口, 如下


import {Inject, Controller, Get, Query} from '@midwayjs/decorator';
import {Context} from '@midwayjs/koa';
import {UserService} from '../service/user.service';
import {AliYunService} from '../service/aliyun.service';
import BaseController from "../core/baseController";

@Controller('/api/user')
export class UserController extends BaseController {@Inject()
    ctx: Context;

    @Inject()
    userService: UserService;
    
    @Get('/login')
    async login() {const url = this.userService.dingTalkLogin();
        this.ctx.redirect(url)
    }
}

2、用户操作后、带着 code 回调, 解决逻辑。

带着 code 回调咱们,其实是一个重定向, 能够看做 get 申请。

于是写一个接口, 来解决回调申请

  • a、用 code 获取 AccessToken
  • b、AccessToken 换取用户信息
  • c、前面就解决业务逻辑了,示例比方 判断用户是否存在, 存在就登陆,不存在,注册,并登陆,最初重定向到首页。

    /**
     * 用户受权回调
     * @param authCode
     */
    @Get('/auth')
    async auth(@Query('authCode') authCode) {
      // a、用 code 获取 AccessToken
      const result = await this.userService.userAccessToken(authCode);
      if (!result.accessToken) {return this.fail()
      }
      // b、AccessToken 换取用户信息
      const userInfo = await this.userService.getUserInfo(result.accessToken)
      
      // c、前面就解决业务逻辑了,示例比方 判断用户是否存在, 存在就登陆,不存在,注册,并登陆,最初重定向到首页。// 判断用户是否存在
      let user: any = await this.userService.findUser({openId: userInfo.openId})
      if (!user) {
          user = {
              openId: userInfo.openId,
              avatarUrl: userInfo.avatarUrl,
              userName: userInfo.nick,
              mobile: userInfo.mobile,
              createTime: new Date()}
          // 不存在注册存库
          await this.userService.saveUser(user)
      }
      // 设置 cookies, 这样就登陆了 伪代码
      this.ctx.cookies.set('st_user', JSON.stringify(user), {
          path: '/', // 写 cookie 所在的门路
          maxAge: 10 * 60 * 1000, // cookie 无效时长
          // expires: new Date('2017-02-15'), // cookie 生效工夫
          httpOnly: true, // 是否只用于 http 申请中获取
          overwrite: false, // 是否容许重写
          encrypt: true, // 加密传输
      });
      // 重定向到首页
      this.ctx.redirect('/')
    }

github 代码链接

https://github.com/girl-email…

总结

通过以上, 咱们理解了第三方受权登陆的根本流程, 并且实现了钉钉第三方网站受权登陆, 明天就到这了,心愿对你有所帮忙,咱们下期见。

正文完
 0