Question

我编写了一个REST API，the api在浏览器中运行正常。但我无法从AngularJS中获取数据。我的代码如下。

这是浏览器中服务器的响应：

[{ “ID”：1， “标题”： “AAA”， “内容”：空}，{ “ID”：2 “标题”：空， “内容”：空}，{ “ID” ：3， “标题”：空， “内容”：空}，{ “ID”：4 “标题”：空， “内容”：空}，{ “ID”：5 “标题”：NULL，”内容 “：空}，{” ID “：6中，” 标题 “：空，” 内容 “：空}，{” ID “：7，” 标题 “：空，” 内容 “：空}，{” ID” ：8中， “标题”：空， “内容”：空}，{ “ID”：9 “标题”：空， “内容”：空}，{ “ID”：10， “标题”：NULL，”内容 “：空}，{” ID “：11，” 标题 “：空，” 内容 “：空}，{” ID “：12，” 标题 “：空，” 内容 “：空}，{” ID” ：13， “标题”：空， “内容”：空}]

研究员：谢谢你们所有人，现在我知道这里有一个跨域问题。但我不知道为什么我仍然可以从Chrome中获取它？如果我可以在服务器端的响应中添加一些标题，那会起作用吗？

angular.module('job',[])
    .controller('BlogController',['$http',function($http){
        this.LoadDate = function(){
            $http.get("http://alvin-api.herokuapp.com/application/skills")
                .success(function(response) {
                    alert("success");
                }).error(function(response){
                alert("error");
            });
        };
    
    }]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="job">
  {{1+3}}
  <div ng-controller="BlogController as b">
    <input type='button' value = 'click me' ng-click="b.LoadDate()"/>
    
    </div>
  
  </div>

Answer 1

当您打开浏览器的开发人员工具（我推测Chrome）时，您会发现XMLHttpRequest无法加载您的网址。

Heroku似乎有问题。

AngularJS: No "Access-Control-Allow-Origin" header is present on the requested resource

Answer 2

请求代码正在运行，虽然不推荐使用成功和错误方法，但您应该使用'then'代替。

这是使用then方法的代码：

angular.module('job',[])
    .controller('BlogController',['$http',function($http){
        this.LoadDate = function(){
            $http.get("http://alvin-api.herokuapp.com/application/skills")
                 .then(function successCallback(response) {
                   alert("success");
                 }, function errorCallback(response) {
                   alert("error");
                 });
        };
    }]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="job">
  {{1+3}}
  <div ng-controller="BlogController as b">
    <input type='button' value = 'click me' ng-click="b.LoadDate()"/>
    
    </div>
  
  </div>

当我尝试运行代码段时，虽然我看到一个阻止请求的错误：

请求时没有'Access-Control-Allow-Origin'标头资源。因此，不允许原点'null'访问。

无法在AngularJS中获取json url

2 个答案: