angular cli + windows 身份验证后端

Question

我创建了一个 Angular CLI 项目，其中包含对包含 Web api 服务的后端项目的代理引用。

launchSettings.json（后端项目）：

...
  "iisSettings": {
    "windowsAuthentication": true,
    "anonymousAuthentication": false,
    "iisExpress": {
      "applicationUrl": "http://localhost:10863/",
      "sslPort": 0
    }
  },
...

proxy.conf.json（前端项目）：

{
  "/api": {
    "target": "http://localhost:10863",
    "secure": false,
    "logLevel": "debug"
  }
}

package.json（前端项目）：

...
"scripts": {
    "ng": "ng",
    "start": "start http://localhost:4200 && ng serve --proxy-config proxy.conf.json",
    "build": "ng build --prod --output-path=..\\CoreTest\\wwwroot",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
...

然后我启动后端并通过运行npm start 启动 Kestrel 网络服务器。使用 angular2 服务，我对其中一个后端服务执行 http-get。由于后端服务在带有 Windows 身份验证的 IISExpress 中运行 （我想要 Windows 身份验证），我收到 401 错误。

我可以npm run build 并浏览到我的 IISExpress url 并加载由 ng build 发布的 index.html，但我想使用 ng serve 方法，因为 ng serve 在内存中工作，因此开发更加顺畅。

我的问题是：如何在开发过程中使用 Angular CLI 和 Windows 身份验证？

Answer 1

对于它的价值，更好的解决方案是使用代理js文件https://github.com/angular/angular-cli/issues/5627#issuecomment-289381319

Answer 2

我在这里发现了一个 hack： http://www.meekdeveloper.com/angular-cli-asp-net-core-windows-authentication/ 有用。我的后端项目现在可以使用User.Identity.Name 正确识别调用用户。 真的是 hack，如果 Angular CLI 能正式支持就太好了！

Answer 3

希望这会有所帮助。

使用以下内容创建一个文件 proxy.conf.json（将目标 url 替换为您的后端的 url）：

{
    "/api": {
        "target": "http://localhost:20938",
        "secure": false
    }
}

使用以下内容创建一个文件 proxy.conf.js（将目标 url 替换为您的后端的 url）：

const Agent = require("agentkeepalive");

module.exports = {
    '/api': {
        target: "http://localhost:20938",
        secure: false,
        agent: new Agent({
            maxSockets: 100,
            keepAlive: true,
            maxFreeSockets: 10,
            keepAliveMsecs: 100000,
            timeout: 6000000,
            keepAliveTimeout: 90000
        }),
        onProxyRes: proxyRes => {
            const key = "www-authenticate";
            proxyRes.headers[key] = proxyRes.headers[key] &&
                proxyRes.headers[key].split(",");
        }
    }
};

将此行放入您的 package.json 文件中的“脚本”部分：

"start": "ng serve --proxy-config proxy.conf.json --o --port 4200"

运行npm start。