OAuth登录

页面

src/views/auth/social-callback/index.vue 后台授权/前台登录都是在此文件处理

添加新的第三方平台

src/views/auth/common.ts由于后台授权和前台登录都需要用到 提取公共组件

/**
 * 账号绑定 list
 * 添加账号绑定只需要在这里增加即可
 * 添加过的项目会在个人主页-绑定账号中显示
 * action不为空的会在登录页显示
 */
export const accountBindList: BindItem[] = [
  {
    key: '1',
    source: 'taobao',
    title: '淘宝',
    description: '绑定淘宝账号',
    avatar: 'ri:taobao-fill',
    color: '#ff4000',
  },
  {
    key: '2',
    source: 'alipay',
    title: '支付宝',
    description: '绑定支付宝账号',
    avatar: 'fa-brands:alipay',
    color: '#2eabff',
  },
  {
    key: '3',
    source: 'ding',
    title: '钉钉',
    description: '绑定钉钉账号',
    avatar: 'ri:dingding-fill',
    color: '#2eabff',
  },
  {
    key: '4',
    source: 'gitee',
    title: 'GITEE',
    description: '绑定GITEE账号',
    avatar: 'simple-icons:gitee',
    color: '#c71d23',
    action: () => handleAuthBinding('gitee'),
  },
  {
    key: '5',
    source: 'github',
    title: 'GITHUB',
    description: '绑定GITHUB账号',
    avatar: 'mdi:github',
    color: 'gray',
    action: () => handleAuthBinding('github'),
  },
];

如注释 添加item后会在用户后台显示 但是实现了action方法才会在登录页显示

后台修改

--- # 三方授权
justauth:
  enabled: true
  # 前端外网访问地址
  address: http://localhost
  type:
    maxkey:
      # maxkey 服务器地址
      # 注意 如下均配置均不需要修改 maxkey 已经内置好了数据
      server-url: http://sso.maxkey.top
      client-id: 876892492581044224
      client-secret: x1Y5MTMwNzIwMjMxNTM4NDc3Mzche8
      redirect-uri: ${justauth.address}/social-callback?source=maxkey

最后的 redirect-uri 里的 source 就是这里的参数, 自己测试可以选择 gitee 平台和 github 平台, 这两个支持本地回调即localhost/127.0.0.1而不用内网穿透或者域名

关于第三方登录超时(github)

比如 github 是可以绑定的, 但是登录会 timeout 主要原因是绑定用的自己的网络, 你能打开 github 那肯定能绑定, 但是登录操作是后台服务器->请求github服务器, 这里造成的超时, 解决办法就是后台加 proxy, 具体可见 JustAuth 文档 访问国外平台抛出异常 Connection Reset 或 Connection timeout