$http.get 与 AWS API 网关答案

【问题标题】：$http.get with AWS API Gateway$http.get 与 AWS API 网关
【发布时间】：2016-06-29 04:00:39
【问题描述】：

所以我在 DynamoDB 中创建了一个超级基本的 NoSQL DB，并使用 API Gateway 来访问数据。我创建了一个非常简单的 Get 请求，它根据它的 ID 检索文档。现在我对 Angular 和 AWS 还很陌生，所以我现在有点不知所措。我玩过不同的代码，发现了一个非常基本的角度示例，它运行 $http.get 并且几乎只是在窗口中显示数据。我的问题是，当我使用任何其他 API 端点运行这个角度代码时，它工作得很好。但是，当我对我的 API Gateway 端点运行此代码时，没有任何东西可以通过。我试过添加一个内容类型的标题，但仍然没有得到任何东西。非常卡住，任何帮助将不胜感激。我敢肯定，我在 API 网关/我的休息电话上错过了一些明显的事情，但任何帮助都会很棒！提前致谢！

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="myCtrl"> 


<h1>{{myWelcome}}</h1>

</div>


<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $http) {
  $http.get("https://xyz.execute-api.us-west-2.amazonaws.com/dev/idex/0001")
 .then(function(response) {
  $scope.myWelcome = response.data;
  });
});
</script>

</body>
</html>

显然 json 应该通过 H1 标签显示，但没有任何内容通过。另外，为了安全起见，我更改了端点 url。

【问题讨论】：

浏览器控制台有错误吗？
两个错误。首先：15:02:43.958 跨域请求被阻止：同源策略不允许读取 [API ENDPOINT URL] 处的远程资源。（原因：CORS 标头“Access-Control-Allow-Origin”缺失）。1 。第二：GET XHR [API Endpoint] [HTTP/1.1 407 Proxy Authentication Required 17ms]
CORS 错误，意味着您应该使用相同的 URL 来访问您的资源：@987654321@
我在 API Gateway 的 GET 方法上启用了 CORS，但我必须在 GET 请求中包含标头吗？
您刚刚启用了它，或者您之前启用了它但它没有工作？

标签： angularjs amazon-web-services aws-api-gateway

【解决方案1】：

首先，我强烈建议您先使用 curl 测试您的 API，以确保它在简单情况下按预期工作，然后再尝试通过浏览器从 Angular 调用它。

正如您问题的一些 cmets 中已经提到的，您需要为此方法启用 CORS。请务必在启用 CORS 后重新部署您的 API。详细说明如下。

在 API Gateway 控制台中，选择您的 GET 方法。从“操作”下拉按钮中，选择“启用 CORS”。在右下角，单击标有“启用 CORS 并替换现有 CORS 标头”的按钮。完成后，从“操作”下拉按钮中选择“部署 API”以重新部署 API。（启用 CORS 后必须重新部署。）

【讨论】：

是的，成功了！没想过重新部署它，但很有意义。感谢 AWS 的 mikeD 和 @Rida BENHAMMANE 的帮助。