如何通过 SSO 将标头变量传递给我的 Angular 2 应用程序？答案

【问题标题】：How to get header variables passed to my angular 2 application via SSO?如何通过 SSO 将标头变量传递给我的 Angular 2 应用程序？
【发布时间】：2017-05-02 00:52:50
【问题描述】：

我是 Angular 2 + NodeJS 的新手。我来自.NET。在 .NET 中，我知道您只会获取请求对象并将服务器变量拉出，但在 Angular 2 中，您似乎必须了解如何获取请求并将标头变量拉出。

我的公司有自己的 SSO，我需要在进入我的应用程序之前获取它添加的标头变量。

如何获取传递给我的应用程序的标头变量？在 Angular 2 中是否有标准的获取方式？

当我试图自己研究它时，我不断得到很多“设置标题”的情况

【问题讨论】：

我不相信你可以通过客户端 JS 实现它。请参阅此处的讨论：stackoverflow.com/questions/220149/…
如果您可以设置标题，我认为可以检索标题
也可以看看这个。 stackoverflow.com/questions/220231/… 但是，这些解决方案要求您先发送 XMLHttpRequest，而不是您的情况。
是的，我看到了。当它从外部网站重定向到我时，似乎找不到解决方案

标签： javascript node.js angular http-headers single-sign-on

【解决方案1】：

我正在为您考虑另一种解决方案。看我的图表。

既然你提到了 .NET，这里就使用 MVC。 https://www.asp.net/mvc 在控制器中，您可以执行以下操作：

    public ActionResult SsoMiddleware()
    {
        string[] keys = Request.Headers.AllKeys;
        string authString = "";
        foreach (var key in keys)
        {
            if (key == "SSO Authentication String")
                authString = Request.Headers[key];
        }

        return View(authString);
    }

在你的视图 SsoMiddleware.cshtml 中，添加 Javascript：

    @model string

    ...

    <script type="text/javascript">
        localStorage.setItem('auth-string', '@(Model)');
        window.location.href = 'angular-app.html';
    </script>

【讨论】：

好吧，即使有这个解决方案。我仍然不知道如何获取标头信息或从外部站点获取标头的位置。
我的问题中的细节可能会产生误导。尽管我的背景是 .NET，但我正在使用 angular 2 和 nodejs。我没有使用 .NET + Angular 2
你使用什么库作为 HTTP 服务？
你的意思是http服务器吗？
在我的电脑上，我使用 Angular CLI 运行。当它被托管时，它会通过 http-server-spa 进入 PCF

【解决方案2】：

您不能直接从客户端获取标头。

您可以做的是在您的应用程序中创建一个路径，该路径仅从请求中获取标头并将它们从服务器传递回客户端，假设您的应用程序在您拥有的任何页面上都有标头。

    app.get('/getVariable', function (req, res) {
  if (req.headers && req.headers.variablename) {
    res.status(200);
    res.send({
      name: req.headers.variablename
    });
  } else {
    res.status(404);
    res.send({
      status: 404,
      message: 'Headers not found'
    })
  }
})

【讨论】：