如何确保 curl 请求获取通过 Angular 附加的用户名和密码？答案

【问题标题】：How do I make sure the curl request gets the username and password appended via angular?如何确保 curl 请求获取通过 Angular 附加的用户名和密码？
【发布时间】：2019-08-30 03:54:30
【问题描述】：

我正在使用静态文件托管我的 Angular Web 应用程序并遇到 401 错误。

问题描述：

当您尝试加载我的 Web 应用程序时，它会提示输入用户名和密码，即使我输入了正确的用户名和密码，我也会收到 401 错误，在调试时我注意到 curl 请求没有附加用户名和密码，而请求，一旦我将用户名和密码添加到它通过的 curl 请求中（见下文），我如何确保 curl 请求获得通过 angular 附加的用户名和密码？

以下是我失败的 curl 请求

curl 'https://ibait.company.com/runtime-es2015.858f8dd898b75fe86926.js' -XGET -H 'Origin: https://ibait.company.com' -H 'Accept: */*' -H 'User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/11.1.2 Safari/605.1.15' -H 'Referer: https://ibait.company.com/'
<html>
<head><title>401 Authorization Required</title></head>
<body bgcolor="white">
<center><h1>401 Authorization Required</h1></center>
<hr><center>AppleHttpServer/54b48526</center>
</body>
</html>

只要我将用户名和密码添加到 curl 请求，它就会通过

curl -u username:password 'https://ibait.company.com/runtime-es2015.858f8dd898b75fe86926.js' -XGET -H 'Origin: https://ibait.company.com' -H 'Accept: */*' -H 'User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/11.1.2 Safari/605.1.15' -H 'Referer: https://ibait.company.com/'

更新（component.ts 中的示例 API 调用）

get_radar_lifecycle_data(){
    this.http.get('https://radar-life-cycle.usspk02.hoster.company.com/api/radar_life_cycle',{params})
        .subscribe(response => {
        console.log("radar data:");
         console.log(response);
         this.newPost = response
     });
}

【问题讨论】：

您需要在您提出请求的地方显示您的角度代码以获得答案。从 curl 命令提示符读出在这里是没有用的
@bryan60 - 我用 component.js 中的一个示例 API 调用更新了这个问题，如果您需要一段特定的角度代码，请告诉我
那个 params 对象是什么

标签： angular curl

【解决方案1】：

你需要这样做：

get_radar_lifecycle_data(){
    const username = 'username'; // need to really get these values from your form
    const password = 'password';
    const headers = new HttpHeaders({
      Authorization: 'Basic ' + btoa(username + ':' + password)
    });
    this.http.get('https://radar-life-cycle.usspk02.hoster.company.com/api/radar_life_cycle', {headers, params})
        .subscribe(response => {
        console.log("radar data:");
         console.log(response);
         this.newPost = response
     });
}

此模式将以 Angular 的形式将基本身份验证标头添加到您的 http 请求中。我无法告诉您如何获取用户名和密码，而无需了解更多有关您如何在表单中收集它们的信息。

【讨论】：

我最担心的是为什么这个问题只发生在 safari 而不是 chrome 或 firefox，我对此部分一无所知
您的问题没有提及跨浏览器问题。您必须发布更多代码并充分解释问题
我在身份验证表单上看到以下注释一旦到位，通过边缘负载均衡器的请求将通过身份验证，并将设置标头 X-Forwarded-User 以将用户名传达给应用程序实例。` , 如何我要从X-Forwarded-User检索用户名和密码吗
它也说The proxy filters the actual username and password and instead communicates just the username with the successful auth.，所以我很困惑如何继续前进，在我输入用户名和密码后，期望服务器验证用户名和密码，然后成功发送用户名授权
正如我所说，我只在 safari 上看到行为，在 chrome 和 firefox 上加载我的 web 应用程序效果很好，在 safari 上加载会将其带到一个空白页面，查看 web inspector 显示 401 错误.我可以分享更多我的角度代码，但你喜欢看什么，从哪里开始？ index.html，app-routing.module.ts，modules .ts 文件等，任何帮助都非常感谢