如何在 AngularJS 中使用 HTTPS？

Question

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

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

谢谢你的帮助。

Answer 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 会使用它们。 即如果你有一个通过 https 提供内容的 NGINX，但通过 http 将请求传递给后端的 Gunicorn，你可能会遇到这个问题。 解决这个问题的方法是将正确的标头传递给 Gunicorn，这样您的框架就会给人一种通过 https 提供服务的印象。 在 NGINX 中，您可以使用以下行执行此操作：

proxy_set_header X-Forwarded-Proto $scheme;

Answer 2

像往常一样使用$http api：

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

如果您的应用程序通过 HTTPS 提供服务，那么您所做的任何调用都将通过 HTTPS 发送到相同的主机/端口等。

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

Answer 3

我最近在使用 Angular 1.2.26 时遇到了类似的问题，但只有在通过负载平衡器进行交互时才会出现 - 这可能会剥离与 https 相关的标头......还不确定原因。 我求助于这个：

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

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