使用Facebook和Twitter进行社交登录

社交登录功能可向网站访客展示使用其Facebook或Twitter帐户登录的选项。 因此,请在其AEM成员配置文件中包含允许的Facebook或Twitter数据。

socialloginweretail

社交登录概述

要包含社交登录,需要创建自定义Facebook和Twitter应用程序。

虽然we-retail示例提供了示例Facebook和Twitter应用程序及云服务,但它们在生产网站上不可用。

所需的步骤包括:

  1. 在所有AEM 发布实例上启用OAuth身份验证。

    未启用OAuth时,尝试登录失败。

  2. ​创建社交应用程序和云服务。

  3. 为社区 站点启用Social登录。

有两个基本概念:

  1. 范围 (权限)指定允许应用程序请求的数据。

  2. 字段 (参数)指定使用URL参数请求的实际数据。

Facebook登录

Facebook API版本

Social登录和we-retail Facebook示例是在Facebook图形API版本1.0时开发的。
更新了自AEM 6.4 GA和AEM 6.3 SP1起的社交登录,以便与较新的Facebook Graph API 2.5版本配合使用。

注意

对于旧版AEM,如果您在日志​中遇到异常。无法从此​提取令牌,请升级到该AEM版本的最新CFP。

有关Facebook图形API版本信息,请参阅Facebook API changelog

创建Facebook应用程序

需要正确配置的Facebook应用程序才能启用Facebook社交登录。

要创建Facebook应用程序,请按照Facebook在https://developers.facebook.com/apps/中的说明操作。 以下信息未反映对其说明所做的更改。

一般情况下,自Facebook API v2.7起:

  • 添加新的Facebook应用程序:
    • 对于​Platform,选择“网站”
      • 对于​网站URL,输入 https://<server>:<port>.
    • 对于​显示名称,输入标题以用作Facebook连接服务的标题。
    • 对于​类别,建议选择​页面应用程序,但可以是任何内容。
    • 添加产品:Facebook登录
      • 对于​有效的OAuth重定向URI,输入 https://<server>:<port>.
注意

对于开发, http://localhost:4503将有效。

创建应用程序后,找到​应用程序ID​和​应用程序密钥​设置。 配置Facebook云服务时需要此信息。

创建Facebook ConnectCloud Service

Adobe的Granite OAuth应用程序和提供程序实例(通过创建云服务配置进行实例化)可标识将新用户添加到的Facebook应用程序和成员组。

  1. 在AEM创作实例上,使用管理员权限登录。

  2. 从全局导航中,选择​工具>Cloud Services> Facebook Social登录配置

  3. 选择配置​上下文路径

    上下 文路径应与您在创建/编辑社区站点时选择的云配置路径相同。

  4. 检查上下文路径是否已启用以在其下创建云服务。

  5. 转到​工具>常规>配置浏览器。 选择上下文并编辑属性。 如果尚未启用,则启用云配置。

    config-propertiespng

  6. 创建/编辑Facebook云服务配置。

    fbsocialloginconfigpng

    • 标题 (必需)输入用于标识Facebook应用程序的显示标题。建议使用与为Facebook应用程序输入的​显示名称​相同的名称。
    • 应用程序ID/API密钥 (必需)输入Facebook 应用程 序的应用程序ID。这会标识从对话框中创建的AdobeGranite OAuth应用程序和Provider实例。
    • 应用程序密钥 (必需)输入Facebook 应用程 序的应用程序密钥。
    • 建用户如果选中此选项,则使用Facebook帐户登录将创建一个AEM用户条目,并将其作为成员添加到选定的用户组。默认选中(强烈建议)。
    • 掩码用户ID:保持取消选中状态。
    • 范围电子邮件:应从Facebook获取用户的电子邮件id。
    • 添加到用 户组选择添加用户组,以为要将用 添加到的社区站点选择一个或多个成员组。
    注意

    可以随时添加或删除组。 但现有用户的成员资格不会受到影响。 自动成员资格仅适用于更新此字段后创建的新用户。 对于禁用匿名用户的网站,选择将用户添加到相应的社区成员组,以便用于该封闭的社区网站。

    • 选择​SAVE
    • 发布.

结果会生成一个Adobe的Granite OAuth应用程序和提供程序实例,除非添加其他范围(权限),否则无需进一步修改。 默认范围是Facebook登录的标准权限。 如果需要其他范围,则需要直接编辑OSGI配置。 如果有修改是直接通过系统/控制台完成的,请避免从触屏UI编辑云服务配置以避免覆盖。

AEM Communities Facebook OAuth提供程序

AEM Communities提供程序扩展AdobeGranite OAuth应用程序和提供程序实例。

此提供程序将需要编辑以:

  • 允许用户更新

  • 在范围🔗内添加其他字段

    • 默认情况下,并非包含所有默认允许的字段。

如果需要编辑,请在每个AEM发布实例上:

  1. 使用管理员权限登录。

  2. 导航到Web控制台。 例如, http://localhost:4503/system/console/configMgr。

  3. 找到AEM Communities Facebook OAuth提供程序。

  4. 选择要打开以进行编辑的铅笔图标。

    fboauthprov_png

    • OAuth提供程序ID

      必需)默认值为​soco -facebook。 请勿编辑。

    • Cloud Service配置

      默认值为​/etc/ cloudservices / facebookconnect。 请勿编辑。

    • OAuth提供程序服务配置

      默认值为​/apps/social/facebookprovider/config/。 请勿编辑。

    • 启用标记

      请勿编辑。

    • 用户路径

      存储用户数据的存储库中的位置。 对于社区站点,为确保成员有权查看彼此的配置文件,路径应为默认的​/home/users/community

    • 启用字段

      如果选中此项,则在向Facebook发出用户身份验证和信息请求时指定列出的字段。 将取消选择默认值。

    • 字段

      启用字段后,在调用Facebook图形API时,将包含以下字段。 必须允许在云服务配置中定义的范围内使用字段。 其他字段可能需要Facebook批准。 请参阅Facebook文档的Facebook登录权限部分。 作为参数添加的默认字段包括:

      • id
      • name
      • first_name
      • last_name
      • 链接
      • 区域设置
      • 图片
      • 时区
      • updated_time
      • 已验证
      • 电子邮件

    如果添加或更改了任何字段,请更新相应的默认同步处理程序配置以更正映射。

    • 更新用
      户如果选中此选项,则每次登录时都会刷新存储库中的用户数据,以反映配置文件更改或请求的其他数据。取消选择默认值。

后续步骤

facebook和Twitter的后续步骤相同:

Twitter登录

创建Twitter应用程序

需要配置的Twitter应用程序才能启用Twitter社交登录。

按照最新说明,在https://apps.twitter.com创建新的Twitter应用程序。

一般而言:

  1. 输入​名称,以标识您的网站用户的Twitter应用程序。

  2. 输入​说明.

  3. 对于​website — 输入https://<server>/。

  4. 对于​回调URL — 输入https://<server>/。

    注意

    无需指定端口。

    对于开发, https://127.0.0.1/将有效。

  5. 创建应用程序后,找到​消费者(API)密钥​和​消费者(API)密钥。 配置Twitter云服务时需要此信息。

权限

在Twitter应用程序管理的权限部分:

  • 访问:选择 Read only

    • 不支持其他选项
  • 其他权限:(可选)选 Request email addresses from users择。

    • 如果未选择,则AEM中的用户配置文件将不包含其电子邮件地址。
    • Twitter的说明说明了需要采取的其他步骤。

对社交登录的唯一REST请求是​GET帐户/验证凭据

创建Twitter ConnectCloud Service

Adobe的Granite OAuth应用程序和提供程序实例(通过创建云服务配置进行实例化)可标识将新用户添加到的Twitter应用程序和成员组。

  1. 在创作实例上,使用管理员权限登录。

  2. 从全局导航中,选择​工具>Cloud Services> Twitter Social登录配置

  3. 选择​上下文路径​配置。

    上下文路径应与您在创建/编辑社区站点时选择的云配置路径相同。

  4. 检查上下文路径是否已启用以在其下创建云服务。

  5. 转到​工具>常规>配置浏览器。 选择上下文并编辑属性。 如果尚未启用,则启用云配置。

    twitterconfigpropping

  6. 创建/编辑Twitter云服务配置。

    twittersocialloginpng

    • 标题 (必需)输入用于标识Twitter应用程序的显示标题。建议使用与为Twitter应用程序输入的​显示名称​相同的名称。

    • 使用者密钥 (必需)输入Twitter 应用程序 的使用者(API)密钥。这会标识从对话框中创建的AdobeGranite OAuth应用程序和Provider实例。

    • 消费者密钥 (必需)输入Twitter 应用程 序的消费者(API)密钥。

    • 建用户如果选中此选项,则使用Twitter帐户登录将创建一个AEM用户条目,并将其作为成员添加到选定的用户组。默认选中(强烈建议)。

    • 掩码用户 ID保留取消选中。

    • 添加到用 户组选择添加用户组,以为要将用 添加到的社区站点选择一个或多个成员组。

    注意

    可以随时添加或删除组。 但现有用户的成员资格不会受到影响。 自动成员资格仅适用于更新此字段后创建的新用户。 对于禁用匿名用户的网站,将用户添加到相应的社区成员组,该组专门用于该封闭的社区网站。

  7. 选择​SAVE​和​Publish

结果会生成一个Adobe的Granite OAuth应用程序和Provider实例,该实例不需要进一步修改。 默认范围是Twitter登录的标准权限。

AEM Communities Twitter OAuth提供程序

AEM Communities配置扩展了AdobeGranite OAuth应用程序和Provider实例。 此提供程序将需要编辑才能允许用户更新。

如果需要编辑,请在每个AEM发布实例上:

  1. 使用管理员权限登录。

  2. 导航到Web控制台

    例如, http://localhost:4503/system/console/configMgr。

  3. 找到AEM Communities Twitter OAuth提供程序。

  4. 选择要打开以进行编辑的铅笔图标。

    twitteroauth_png

    • OAuth提供程序ID (必需)

      默认值为​soco -twitter。 请勿编辑。

    • Cloud Service配置

      默认值为​conf。 请勿编辑。

    • OAuth提供程序服务配置

      默认值为​/apps/social/twitterprovider/config/。 请勿编辑。

    • 用户路径

      存储用户数据的存储库中的位置。 对于社区站点,为确保成员有权查看彼此的配置文件,路径应为默认的​/home/users/community

    • 启用 参数不编辑

    • URL参 数不编辑

    • 更新用户

      如果选中此项,则每次登录时都会刷新存储库中的用户数据,以反映配置文件更改或请求的其他数据。 将取消选择默认值。

后续步骤

facebook和Twitter的后续步骤相同:

启用社交登录

AEM Communities站点控制台

配置云服务后,可以使用社区站点创建管理期间的用户管理设置子面板为社区站点启用相关的社交登录设置。

  1. 选择保存社交登录配置的网站配置上下文。

  2. 在常规选项卡上,设置云配置。

    managesites_png

  3. 在“设置”选项卡上,启用​社交登录​并保存。

    usermgmt_png

测试社交登录

  • 确保在所有发布实例上启用了AdobeGranite OAuth身份验证处理程序
  • 确保云服务已发布
  • 确保社区站点已发布
  • 在浏览器中启动已发布的网站
    例如, http://localhost:4503/content/sites/engage/en.html
  • 选择​登录
  • 选择​使用Facebook登录​或​使用Twitter登录
  • 如果尚未登录Facebook或Twitter,请使用相应的凭据登录
  • 可能需要授予权限,具体取决于Facebook或Twitter应用程序显示的对话框
  • 请注意,页面顶部的工具栏已更新,以反映成功登录
  • 选择​配置文件:用户档案页面显示用户的头像图像、名字和姓氏。 它还会根据允许的字段/参数显示Facebook或Twitter配置文件中的信息。

AEM Platform OAuth配置

AdobeGranite OAuth身份验证处理程序

默认情况下,Adobe Granite OAuth Authentication Handler未启用,并且必须在所有AEM发布实例上启用​

要在发布时启用身份验证处理程序,只需打开OSGi配置并保存它:

  • 使用管理员权限登录
  • 导航到Web控制台
    例如, http://localhost:4503/system/console/configMgr
  • 找到Adobe Granite OAuth Authentication Handler
  • 选择以打开要编辑的配置
  • 选择​Save

chlimage_1-489

注意

请注意,不要将身份验证处理程序与​AdobeGranite OAuth应用程序和提供程序​的Facebook或Twitter实例混淆。

chlimage_1-490

AdobeGranite OAuth应用程序和提供程序

创建Facebook或Twitter的云服务后,将创建Adobe Granite OAuth Authentication Handler的实例。

要找到为Facebook或Twitter应用程序创建的实例,请执行以下操作:

  1. 使用管理员权限登录。

  2. 导航到Web控制台

    例如, http://localhost:4503/system/console/configMgr。

  3. 找到AdobeGranite OAuth应用程序和提供程序。

    • 找到​客户端ID​与​应用程序ID​匹配的实例

    chlimage_1-491

    除以下属性外,请保持配置的其他属性不变:

    • 配置ID

      必需)OAuth配置ID必须唯一。 创建云服务时自动生成。

    • 客户端 ID

      必需)创建云服务时提供的应用程序ID。

    • 客户端密钥

      必需)创建云服务时提供的应用程序密钥。

    • 范围

      可选)可以从提供程序询问允许的其他范围。 默认范围涵盖提供社交身份验证和用户档案数据所需的权限。

    • 提供程序ID

      必需)创建云服务时,会设置AEM Communities的提供程序ID。 请勿编辑。 对于Facebook Connect,值为​soco -facebook。 对于Twitter Connect,值为​soco -twitter

    • 建议)一个或多个成员组,创建了用户。 对于AEM Communities,建议列出社区站点的成员组。

    • 回调 URL

      可选)使用OAuth提供程序配置的URL,用于重定向回客户端。 使用相对URL来使用原始请求的主机。 将留空,以改用最初请求的URL。 后缀“/callback/j_security_check”会自动附加到此URL中。

    注意

    回调的域必须向提供程序(Facebook或Twitter)注册。

对于每个OAuth身份验证处理程序配置,实例中还创建了两个其他配置:

  • Apache Jackrabbit Oak默认同步处理程序(org.apache.jackrabbit.oak.spi.security.authentication.external.impl.DefaultSyncHandler) — 无需进行编辑,但您可以查看用户字段映射Facebook字段如何映射到CQ用户配置文件节点。 另请注意,“同步处理程序名称”与OAuth提供程序配置的配置ID匹配。
  • Apache Jackrabbit Oak外部登录模块(org.apache.jackrabbit.oak.spi.security.authentication.external.impl.ExternalLoginModuleFactory) — 无需进行编辑,但您可能会注意到“身份提供程序名称”和“同步处理程序名称”相同,并分别指向相应的OAuth和同步处理程序配置。

有关更多信息,请参阅使用Apache Oak外部登录模块进行身份验证

OAuth用户遍历性能

对于社区网站,如果有数十万用户使用Facebook或Twitter登录方式进行注册,则添加以下Oak索引可以提高网站访客使用其社交登录方式时执行查询的遍历性能。

如果日志中出现遍历警告,建议添加此索引。

在创作实例上,使用管理权限登录:

  1. 从全局导航:选择​工具, CRX/DE Lite

  2. 从ntBaseLucene的副本创建名为ntBaseLucene-oauth的索引:

    • 在节点/oak:index下
    • 选择节点ntBaseLucene
    • 选择​Copy
    • 选择 /oak:index
    • 选择​粘贴
    • 将ntBaseLucene的副本重命名为ntBaseLucene-oauth
  3. 修改ntBaseLucene-oauth节点的属性:

    • indexPath:/oak:index/ntBaseLucene-oauth
    • 名称:oauthid-123xxxx
    • 重新索引:true
    • reindexCount:1
  4. 在节点/oak:index/ntBaseLucene-oauth/indexRules/nt:base/properties下:

    • 删除除cqTags之外的所有子节点。

    • 将cqTags重命名为oauthid-123xxxx

    • 修改oauthid-123xxxx节点的属性

      • 名称:oauthid-123xxxx
    • 选择​全部保存

&ast; 对于 ​nameoauthid-123,请将 123 替换为Facebook 应用程序 ID或Twitter 消费者(API) 密钥,该密钥是 AdobeGranite OAuth应用程序和 提供程序配置中 客户端ID的值。

chlimage_1-492

有关其他信息和工具,请参阅Oak查询和索引

调度程序配置

请参阅为Communities配置Dispatcher

在此页面上