无法使用 angularjs 调用 django json 视图答案

【问题标题】：can't call django json view with angularjs无法使用 angularjs 调用 django json 视图
【发布时间】：2013-09-04 23:36:44
【问题描述】：

我是 django 和 angularjs 的新手。我想将 Django 用于 REST api，将 angularjs 用于前端视图。

我有一个返回 json 响应的 django 视图：

class MyView(View):

    def get(self, request):
        data = serializers.serialize('json', MyModel.objects.order_by('name'))
        return HttpResponse(data, mimetype='application/json')

    def options(self, request):
        response = HttpResponse()
        response['allow'] = ','.join(['get', 'post', 'put', 'delete', 'options'])
        return response

打电话

http://localhost:8000/myapp/myview

我得到了正确的 json 响应

如果在 angularjs 控制器 (controllers.js) 中，我尝试像这样调用该视图：

angular.module('myApp.controllers', []).
  controller('MyCtrl', ['$scope', '$http', function($scope, $http) {
    $scope.test = "Hola";
    delete $http.defaults.headers.common['X-Requested-With'];
    $http.get('http://localhost:8000/myapp/myview').success(function(data) {
      $scope.results = data;
      console.log(data);
    }).error(function(data, status) {
      $scope.data = data || "Request failed";
      $scope.status = status;
      console.log(data);
    });
}]);

“测试”值在模板中正确打印

在 django 日志中我有：“GET /myapp/myview/HTTP/1.1”200 853

但在角度我不检索任何数据。如果我在错误方法中设置断点，则数据为空且状态 = 0。

有什么提示吗？我错过了什么吗？

【问题讨论】：

您可以尝试在$scope.results = data; 行下方添加console.log(data) 行，并说明您是否在控制台（萤火虫等）中看到数据？
你能从 Web 控制台显示 xhr 请求和响应标头吗？
删除此网址的最后一个正斜杠http://localhost:8000/myapp/myview/
你能发布你的 URLconf 以防万一吗？
解决了在我的回复中添加response['Access-Control-Allow-Origin'] = XS_SHARING_ALLOWED_ORIGINS和response['Access-Control-Allow-Methods'] = ['POST','GET','OPTIONS', 'PUT', 'DELETE']，然后在django“get”方法中返回它

标签： django json angularjs

【解决方案1】：

一直在苦苦挣扎。问题在于CORS。 The solution is here

【讨论】：

【解决方案2】：

$http.get('http://localhost:8000/myapp/myview/').success(function(data)

URL 需要去掉尾随的 /，然后附加 .json。像这样：

$http.get('http://localhost:8000/myapp/myview.json').success(function(data)

【讨论】：

我也试过这个，但我有相同的结果：一个 200 但一个空字符串
贴出所有的angular控制器代码，可能你错过了将$http服务注入到模块中。