# 配置自定义社会化登录

Authing 提供接入自定义 OAuth2.0 身份提供商的能力,如果你需要连接非 Authing 内置的社会化登录身份源,可以通过本文的方式来实现。

# 创建自定义社会化登录连接

# 填写应用基本信息

进入 Authing 控制台 > 连接身份源 > 社会化登录,在最下方找到「连接自定义社会化登录」,点击右侧的加号。

在弹出的抽屉中,首先填写一些基本的连接信息,连接标志符、显示名称,你可以上传一个应用 Logo。

# 填写身份源基本信息

接下来填写一些外部社会化登录提供商的基本信息,你可以从外部 OAuth2.0 身份提供商的文档中找到相关的 URL 端点,包括授权端点Token 端点Scope 可选值。还要填写外部 OAuth2.0 社会化登录身份源的应用 ID应用密钥,这些信息你可以在外部 OAuth2.0 社会化登录身份源处找到。

虽然 scope 在这里的表单中是可选的,但某些外部 OAuth2.0 社会化登录身份源可能要求 scope 参数必传,建议在这里填写相应的配置。

授权链接模板是一个字符串模板,你可以使用 ${authEndPoint}${tokenEndPoint}${scope}${clientId}${clientSecret} 这些宏。

宏与表单项的对应关系如下表:

表单项
${authEndPoint} 授权 URL
${tokenEndPoint} Token URL
${scope} scope
${clientId} 应用 ID
${clientSecret} 应用密钥

示例:

如果授权链接模板填写:

${authEndPoint}?client_id=${clientId}&response_type=code&state=4634641&scope=${scope}&redirect_uri=https://core.authing.cn/connections/oauth2/5fa91b0f50315451dc86086d/callback

将来会生成以下授权 URL:

https://login.microsoftonline.com/8f909eb1-99fe-4f75-b4e0-2f7ab37815c6/oauth2/v2.0/authorize?client_id=fc52a7ab-4172-4db3-9292-e51f85a1576e&response_type=code&state=4634641&scope=openid profile&redirect_uri=https://core.authing.cn/connections/oauth2/5fa91b0f50315451dc86086d/callback

# 上传自定义代码片段

最后,也是最关键的部分,你需要上传自定义代码片段完成 Code 换 TokenToken 换用户信息并进行字段对齐的功能。

Authing 已经为你提供了模板代码:

你可以在函数中使用 request-promise (opens new window) 库发送网络请求。

# codeToToken 函数

以下是 codeToToken 函数的模板代码,函数的第一个参数 code 是授权码,你需要用这个 code 从外部 OAuth2.0 社会化登录身份提供商的 Token 端点换取的 AccessToken。

async function codeToToken(code, connection) {
  const options = {
    method: 'POST',
    uri: '外部 OAuth2.0 IdP Token 端点',
    form: {
      client_id: '外部 OAuth2.0 IdP 的应用 ID',
      client_secret: '外部 OAuth2.0 IdP 的应用密钥',
      grant_type: 'authorization_code',
      redirect_uri: 'https://core.authing.cn/connections/oauth2/{连接 ID}/callback',
      code,
    },
    json: true,
  };
  const resp = await request(options);

  // 在这里返回 AccessToken 的字符串值
  return resp.access_token;
}

# tokenToUserInfo 函数

以下是 tokenToUserInfo 函数的模板代码,函数的第一个参数 accessToken 是上一个函数 codeToToken 函数的返回值(本例中为 resp.access_token),你需要用 accessToken 从外部 OAuth2.0 社会化登录身份提供商的用户信息端点换取用户信息,并完成字段对齐。返回值是一个对象,内容必须为符合 Authing 数据格式的用户信息字段,且必须包含 userIdInIdp 字段,该字段内容为用户在外部身份提供商中的唯一标识符,也就是用户 ID。

async function tokenToUserInfo(accessToken, connection) {
  const options = {
    method: 'POST',
    uri: '外部 OAuth2.0 IdP 用户信息端点',
    form: {
      access_token: accessToken,
    },
    json: true,
  };
  const resp = await request(options);

  // 进行字段对齐
  const profile = {
    // 必须包含 userIdInIdp 字段
    userIdInIdp: resp.sub,
    name: resp.name,
    familyName: resp.family_name,
    givenName: resp.given_name,
    photo: resp.picture,
  };
  return profile;
}

请将用户信息对齐到以下字段,即 tokenToUserInfo 函数返回的内容必须为一个对象,且这个对象中的 key 必须存在于下表中的字段名,Authing 用户信息字段含义表:

字段名 格式 含义
username string 用户名
email string 邮箱
emailVerified boolean 邮箱是否验证
phone string 手机号
phoneVerified boolean 手机号是否验证
birthdate string 生日
familyName string 姓氏
gender string 性别
locale string 生日
middleName string 中间名
givenName string
nickname string 昵称
photo string 头像链接
profile string 个人资料页链接
preferredUsername string 喜欢的用户名
updatedAt Date 更新日期
website string 个人网站
zoneinfo string 时区

最后点击「保存」。到此自定义外部社会化登录的设置就全部完成了,接下来我们来体验一下使用自定义社会化登录连接进行认证。

# 测试连接

进入控制台 > 应用 > 应用列表,随意选择一个应用,点击「体验」。

在登录页面,点击「使用 自定义社会化登录 登录」。

弹出的登录框中,在外部社会化登录身份源完成认证。

登录成功。

登录成功后跳转到回调地址,携带 code 授权码。

# 接下来你可能需要

使用授权码换取用户信息:

使用 OIDC 授权