绪论
在这篇博客中，我们将在一个例子的帮助下，使用angularx社交登录包学习亚马逊和Facebook单点登录。我们将为亚马逊和Facebook创建一个简单的登录按钮。当用户点击该应用的权限页面时，会出现。
在这里，你会发现如何在Angular中使用OAuth Social Login创建一个与Facebook和Amazon的登录。
一旦用户给了应用程序权限，个人信息/细节将被应用程序接收。
在这个机制中，你将使用angularx-social-login包来建立angular应用程序与亚马逊和Facebook之间的安全连接。
angularx-social-login ( @abacritt/angularx-social-login ) 模块有助于为Angular 9+应用程序实现社交登录和认证模块。你可以整合加VK、Facebook和亚马逊的社交登录。如果这些还不够，你也可以去找自定义提供者。
亚马逊OAuth实例
OAuth登录（社交登录）提供了一种简单而快速的方式来实现网络应用中的单点登录。它简化了通过Facebook、Instagram和亚马逊等社交网站的登录和签到过程。
因此，下面是在angular应用程序中设置单点登录的步骤。
第1步：在亚马逊上创建开发者账户以实现单点登录。
要实现单点登录，首先你需要在亚马逊上创建一个开发者账户。因此，要开始使用开发者账户，请访问这个链接：https://developer.amazon.com或按照下面的参考图片。
第2步：设置你的单点登录Auth提供者。获取亚马逊应用程序ID
在这一步，你需要创建一个亚马逊应用程序；这个应用程序为你制作一个客户ID。因此，为了创建亚马逊应用，你需要用你的亚马逊账户进入亚马逊开发者控制面板，以获得亚马逊应用。
一旦你进入亚马逊开发者仪表板，你需要创建一个亚马逊安全配置文件，以接收亚马逊客户ID和客户秘密ID。所以你需要点击创建安全配置文件按钮。屏幕截图也附在后面供参考。
现在输入安全配置文件名称、安全配置文件描述，以及你的应用程序的同意隐私通知URL，然后点击保存按钮。
一旦你点击了保存按钮，就会为你生成客户ID和客户的秘密。
只需复制Angular应用程序的客户ID凭证或在记事本中记下它。
第3步：安装Angular Social Login包
首先，使用必要的命令安装Angular CLI。
npm install -g @angular/cli
此后，使用该命令安装一个新的angular应用程序。
ng new ng-demo-app
前往angular应用程序，然后你需要使用以下命令安装angularx-social-login模块。
npm install angularx-social-login --force
第4步：在应用程序模块中添加社交登录模块
安装完angularx-social-login模块后，在app.module.ts文件中添加SocialLoginModule、SocialAuthServiceConfi、FacebookLoginProvider、AmazonLoginProvider和ReactiveFormsModule以配置单点登录。
第5步：为亚马逊创建SSO按钮
之后，你可以在component.html文件中添加模板，在component.ts文件中添加登录。
component.html文件
component.ts文件
运行你的应用程序
现在你的单点登录已经与你的angular应用程序集成，现在你能够启动本地主机服务器并检查功能。
总结
在Angular中使用亚马逊和Facebook的单点登录（SSO）现在已经完成了。这篇博客帮助你了解了如何使用客户端ID创建亚马逊和Facebook的SSO。
谢谢你的阅读，我希望这篇博客能帮助你了解单点登录的知识。
