Question

我已经为客户端创建了角度为2的Web应用程序，为服务器端创建了带有NodeJS框架的express。

对于客户端，我生成的项目angular-cli运行在lite-server上，因此我的客户端和服务器运行在2种不同的服务上。

我想整合ADFS身份验证。要实现身份验证，我使用的是passport-saml包。我的服务器端API中有一个中间件需要用户进行身份验证。

直接到达服务器（没有客户端）时，身份验证过程正常。

但是，我无法通过API访问@angular/http。我尝试了一个来自服务器的简单GET请求（端点中间件），因此我得到了没有重定向的身份验证页面（我不认为它是核心问题，但实际的实施是）。

在对服务器和客户端使用单独的服务时，如何正确实现身份验证？

Answer 1

您好我也面临同样的问题我的角度项目托管在4200端口上。和我的节点在3000端口上。当我们有两个端口运行时很难实施护照。

第1步通过对公用文件夹进行ng构建来使角度项目静态化。确保angular-cli.json有*"outDir": "../public",*

第2步现在我们可以使用相同的节点端口来访问角度根，请在节点app.js

中添加以下代码

var path = require('path');
  // Set Static Folder
app.use(express.static(path.join(__dirname, 'public')));
app.get('*', function(req, res) {
     res.sendFile(path.join(__dirname, 'public/index.html'));
});

这将使您的角度项目可以通过节点端口访问。

第3步：现在我们可以在UI中添加护照登录按钮并提供网址<a href="/passport/auth/twitter">twitter</a>

这不是解释意味着要问我怀疑。

Answer 2

当客户端向服务器执行GET时，您没有详细说明失败的响应。是400吗？ 401？ 404？ 500？你收到了CORS错误吗？

为什么使用GET作为登录端点。您应该在POST有效负载中正在POST凭证吗？

无论如何，在你的angular2代码中你应该有一个使用登录方法的auth服务。登录方法应该像..

login(credentials) {
    return http.post(your_server_url, payload);
}

然后，您可以订阅登录方法返回的Observable，如果主页的所有内容都很好router.navigate，或者如果它没有顺利显示登录错误消息。

Answer 3

在..src / environments / environment.ts

中为ui和server设置单独的URL

 export const environment = {
  production: false,
  BASE_URL: 'http://localhost:4200',
  API_BASE_URL: 'http://localhost:5000',
};

在节点app.js

中

    app.use('/', express.static('public'));
  app.get('*', function (req, res) {
    res.sendFile(path.join(process.cwd(), 'public', 'index.html'));
  });

使用分离的客户端和服务器进

3 个答案: