我已经成功地在Node JS中实现了多个社交登录。
我坚持在 MEAN 堆栈中的实现。
到目前为止，我已经实现的流程：
第 1 步：
棱角分明的按钮。在单击时，我正在调用节点中的API，该API返回用户必须转发到的OAuth URL。
步骤2：
用户输入正确的凭据后，将生成access_token并发送到 Node 中的回调 URL。
步骤3：
我需要向 Angular 发送回调，无论是否已生成access_token。我不确定如何将数据传递给角度页面。
这是正确的方法吗？
所以我自己正在做一个平均堆栈社交媒体项目，我使用了 oauth.io，
https://github.com/oauth-io/oauth-js
它非常易于使用和可实现，您唯一需要知道的是如何在 Angular 中导入 npm 包。
LinkedIn HTML 组件
<html>
<header>
</header>
<body>
<a (click)="linkedinConnector()" id="linkedin-button" class="btn btn-block btn-social btn-linkedin">
<i class="fa fa-linkedin"></i> Sign in with Linkedin
</a>
</body>
</html>
林肯丁 TS 组件
import { Component, OnInit } from '@angular/core';
import 'oauthio-web';
declare var OAuth: any;
@Component({
selector: 'app-linkedin-connector',
templateUrl: './linkedin-connector.component.html',
styleUrls: ['./linkedin-connector.component.css']
})
export class LinkedinConnectorComponent implements OnInit {
constructor(private api: ApiService) { }
ngOnInit() {}
public linkedinConnector() {
OAuth.initialize('OAUTH-IO PUBLIC KEY');
// Use popup for oauth
OAuth.popup('linkedin2').then(linkedin => {
console.log('linkedin:', linkedin.access_token);
linkedin.get('/v1/companies/[company-ID]/updates?format=json').then(data => {
//do with the data what you want
});
});
}
}
但是，IM 使用弹出窗口而不是重定向。 它们也有重定向功能，因此您可以使用那里的文档
http://docs.oauth.io/来实现它
有两种方法可以做到这一点。一种是使用护照.js并使用OIDC客户端。以下是两种自律的示例
Passport.js implementation
Oidc implementation
所以当身份验证令牌生成时。您将用户重定向到某个回调 URL 以及身份验证令牌。您的节点服务器将侦听该 URL，并将使用会话的某个节点库存储用户会话。 随之而来的是，如果不将他重定向到其他网址，您将执行 res.redirect 到 url，如果生成身份验证令牌，用户将登陆该网址。
假设在您的角度应用程序中，您有两个URL登录URL，登录URL。
如果身份验证成功：
因此，如果生成了身份验证令牌，则将用户重定向到登录的 URL 并为用户设置会话 cookie。
如果身份验证失败：
如果未生成身份验证令牌，则将用户重定向到具有某些错误状态的登录 URL，作为 url 查询参数的一部分。类似于/login？auth_error=true 的东西，您可以在其中适当地处理auth_error并在客户端上显示。
从安全角度来看，在您的节点层上编写一个中间件，用于验证您的所有 api 请求，并检查用户会话 cookie 是否有效，否则将他重定向到登录页面。
同样在我看来，可能有多种方法可以做到这一点，但这就是我在应用程序中实现登录的方式。所以这个答案就是从这个角度出发的。
在 Angular 中，您可以使用已经可用的库来实现这一点。无需自己动手。 在这里，您可以链接到两个也经过 OIDC 认证的此类库：
- 角度-身份验证-oidc-客户端
- 角度-oauth2-oidc
我还添加了指向 OIDC 身份验证的 Google 说明的链接，您可以在其中获得配置库以使用来自 Google 的 OIDC 身份验证的所有必要信息。
还可以查看这个库angular-6-social-login，它为Google，Facebook和LinkedIn提供登录。
这都是开源的，所以你仍然可以自己做，并使用库作为如何做的例子。