Question

首先，让我感谢你们在这里所做的出色工作。在遇到不同的错误时，你帮助了我很多。但这次似乎没有什么能解决我的问题。我试图使用Angular JS使用JSON，我使用Spring Boot生成JSON。 JSON看起来像这样：

{
  "id": 65,
  "url": "http://localhost:9000/",
  "key": "com.SocGen:Test",
  "name": "Test",
  "lname": "Test",
  "scope": "PRJ",
  "qualifier": "TRK",
  "uuid": "AVMtRdoEBufaCmDWZmPf",
  "description": "Test",
  "version": "0.0.1-SNAPSHOT",
  "date": "2016-03-11T11:57:29+0200",
  "creationDate": "2016-02-29T15:44:25+0200",
  "allMsr": [
    {
      "id": 2855,
      "key": "files",
      "val": "10.0",
      "frmt_val": "10",
      "project": null,
      "date": "2016-03-11T11:57:29+0200"
    },
    {
      "id": 2856,
      "key": "duplicated_blocks",
      "val": "0.0",
      "frmt_val": "0",
      "project": null,
      "date": "2016-03-11T11:57:29+0200"
    }
  ]
}

我的 index.html 如下所示：

<!doctype html>
<html>
<head>
<title>Hello AngularJS</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="hello.js"></script>
</head>
<body ng-app>
    <table ng-controller="Hello">
    <thead>
        <tr>
            <th>ID</th>
            <th>Name</th>
            <th>URL</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>{{project.id}}</td>
            <td>{{project.name}}</td>
            <td>{{project.url}}</td>
        </tr>
    </tbody>
    </table>
</body>
</html>

hello.js ：

function Hello($scope, $http) {
    $http.get('http://localhost:8080/project/65').
        success(function(data) {
            $scope.project = data;
        });
}

我花了2个小时试图找到一个解决方案，但没有运气。我知道这个问题已有答案，但我尝试了很多，但似乎没有一个对我有用。

那么，这里的错误是什么？谢谢！

Answer 1

问题是我在本地运行它并且我的浏览器阻止了CORS（跨源资源共享）。

解决问题的方法是为chrome安装一个小扩展。只需搜索它，你就会找到它。

Answer 2

正如您所说，CORS阻止了您的请求。

如何只是添加Chrome扩展程序来解决您的问题。它不会在任何其他浏览器上工作。您是否可以要求用户安装chrome扩展程序来运行您的应用程序。

永久解决方案是从服务器端添加CORS头。

Access-Control-Allow-Origin:*

以下是一些解决您问题的链接：

Link1
Link2

AngularJS - 无法显示JSON中的数据

2 个答案: