如何在 AngularJS 中使用 HTTPS？

Posted 2023-02-25

【中文标题】如何在 AngularJS 中使用 HTTPS？

【英文标题】：How can I use HTTPS in AngularJS?

【发布时间】：2013-09-21 06:46:20

【问题描述】：

我正在使用 AngularJS、$resource 和 $http 并使用 apis，但是由于安全原因，我需要发出 HTTPS 请求（在 HTTPS 协议下工作）。

在AngularJS中使用https的方法是什么。

感谢您的帮助。

【参考方案1】：

由于某种原因，如果您的请求末尾没有尾部 / ，Angular 会通过 HTTP 发送所有请求。即使页面本身是通过 HTTPS 提供的。

例如：

$http.get('/someUrl').success(successCallback);  // Request would go over HTTP even if the page is served via HTTPS

但是如果你添加一个前导 / 一切都会按预期工作：

$http.get('/someUrl/').success(successCallback);  // This would be sent over HTTPS if the page is served via HTTPS

编辑：这个问题的根本原因是 Angular 查看来自服务器的实际标头。如果您通过 https 的 http 数据内部传递不正确，那么仍然会有 http 标头，如果您没有在末尾添加 /，Angular 会使用它们。 即，如果您有一个 nginx 通过 https 提供内容，但通过 http 在后端将请求传递给 Gunicorn，您可能会遇到此问题。解决这个问题的方法是将正确的标头传递给 Gunicorn，这样您的框架就会被认为是通过 https 提供服务的。在 NGINX 中，您可以使用以下行来执行此操作：

proxy_set_header X-Forwarded-Proto $scheme;

【讨论】：

非常感谢@Danil，API 调用无法正常工作，真是一片混乱！但你的回答让我走上了正确的道路，我只花了 5 分钟就解决了这个问题。

在我的情况下是相反的。使用tailing / 它会通过http发送请求。很高兴找到这个答案

【参考方案2】：

像往常一样使用$http api：

$http.get('/someUrl').success(successCallback);

如果您的应用程序通过 HTTPS 提供服务，那么您进行的任何调用都将发送到相同的主机/端口等，因此也可以通过 HTTPS。

如果您对请求使用完整的 URI，例如$http.get('http://foobar.com/somePath') 那么您将不得不更改您的 URI 以使用 https

【讨论】：

这（使用相对 URL）在我的本地设置（Linux 上的 Chrome 版本 35.0.1916.114）上是不够的。假设它适用于每个浏览器/平台可能是危险的。

您是否在本地设置上通过 https 提供服务？会发生什么？

它只使用http调用，我必须将'/someUrl'更改为$window.location.origin + '/someUrl'。

投反对票，因为我的$http 确实使用http:// 协议而不是https:// 发出请求，尽管该页面是从https 提供的。

@pztrick，你找到解决方案了吗？我的 $http 似乎也使用 http:// 而不是 https:// 发出请求。

【参考方案3】：

我最近在使用 Angular 1.2.26 时遇到了类似的问题，但仅限于通过负载平衡器进行交互时 - 这可能会剥离与 https 相关的标头...尚不确定原因。我已经采取了这个措施：

uri = $location.protocol() + "://" + $location.host() + "/someUrl"

如果使用非标准端口，您可能还需要添加 $location.port()。