使用Django-Angular对视图进行AJAX调用

Question

我正在尝试使用Django-Angular对Django中的视图进行AJAX调用.我在这里遵循这个指南.

但是,当我发布POST时,我收到消息:CSRF验证失败.请求中止.似乎没有调用文档中action描述的内容,因为我不需要令牌. process_something

任何人都可以发现这个问题,下面是我到目前为止所尝试的 ...

这是相关的js控制器脚本:

   var in_data = {action: 'process_something', somevar: $scope.somevar};
   var post_call = CbgenRestangularDjango.all('pin-verification/').post(in_data)

和形式:

<form ng-controller="PinValidationFormCtrl"  name="CompanyValidPinForm" class="bs-callout">
        <div class="col-xs-2">
            <input class="form-control" name="somevar" ng-model="somevar" type="text">
        </div>

        <div class="col-xs-2">
            <button type="button" class="btn btn-default" ng-click="submitPin()">Verify Pin</button>
        </div>
</form>

和观点:

class VerificationView(JSONResponseMixin, View):
    # other view methods

    @allowed_action
    def process_something(self, in_data):
        # process input data
        out_data = {
            'foo': 'bar',
            'success': True,
        }
        return out_data

Answer 1

该post()方法接受配置参数来传递X_CSRFTOKEN标头:

var config = { headers : { 'X_CSRFTOKEN' : $cookies.csrf_token }};
var in_data = {action: 'process_something', somevar: $scope.somevar};
var post_call = 
CbgenRestangularDjango.all('pin-verification/').post(in_data, config);

在视图的模板中,表单必须包含令牌,如下所示:

<form ...>
    {% csrf_token %}
    ...
</form>

注意$cookies取决于ngCookies(见http://docs.angularjs.org/api/ngCookies.$cookies)

Answer 2

您很可能在角度的应用程序模块配置中缺少标头。

尝试设置以下内容

.config(function($httpProvider) {
  $httpProvider.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
});

Django 应用程序不需要此标头，但如果缺少此标头，则所有对以下内容的调用都request.is_ajax()将返回 False，即使对于完全有效的 Ajax 请求也是如此

在这里找到： http: //django-angular.readthedocs.org/en/latest/integration.html 另外，Angular 版本 >= 1.1.x 也有 api 更改（自该版本以来，此标头默认值已被删除）。也许 Django 没有在每个部分都跟上他们的文档。

也许您只需要清除浏览器缓存，因为您可能有过时的 cookie 发送无效令牌，从而导致请求映射失败。