AngularJs 和 Django 的 Ajax 请求

Posted 2023-02-24

技术标签:

【中文标题】AngularJs 和 Django 的 Ajax 请求【英文标题】：Ajax request with AngularJs and Django 【发布时间】：2015-02-13 12:33:08 【问题描述】：

我正在尝试发出 Ajax 请求，但是，直到位于 views.py 文件中的 escalando() 函数才发送信息出现错误

POST http://localhost:8000/escalar 403 (FORBIDDEN)

我不知道自己做错了什么

目录组织如下：

+bvm
-manage.py
  +bvmf
    -__init__.py
    -settings.py
    -url.py
    -wsgi.py
    +bvmfconsulta
       -__init__.py
       -views.py
       +templates
          -postt.html

文件 postt.html

<!DOCTYPE html>
<html ng-app>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js"></script>
    <script>
        function ListDropdown($scope, $http)
            $scope.ccvms=lista01:['1','3','5','7','9'],lista02:['2','4','6','8','10']
            $scope.send=function(x,y)
                $http.post("/escalar",x+y)
            
         
    </script>
</head>

<body>
    <div ng-controller="ListDropdown">
        <select ng-model="ccvm" ng-options="ccvm as ccvm for (ccvm, nums) in ccvms"></select>
        <select ng-model="num" ng-disabled="!ccvm" ng-options="num for num in ccvms[ccvm]" ng-change="send(num, ccvm)"></select>
    </div>
</body>
</html>

文件 url.py

from django.conf.urls import patterns, include, url
urlpatterns = patterns('',
url(r'^post2/','bvmfconsulta.views.post3'),
url(r'^escalar','bvmfconsulta.views.escalando')
)

文件views.py

from django.shortcuts import render_to_response
from bvmfconsulta.escala import demonstrativos

def post3(request):
   return render_to_response("postt.html")

def escalando(self,args):
   print args

【问题讨论】：

阅读这个docs.djangoproject.com/en/dev/ref/csrf和这个***.com/a/18156756/2169114 【参考方案1】：

您必须进行一些更改。

确保您的发布请求具有正确的标头。在角度更改您的 post 命令以在 post 对象中包含数据改变您的 django 视图期待发布请求并访问发布数据。

配置您的 Angular POST 以获得正确的标题

在您的 javascript 部分中：

var ListDropdown = angular.module('ListDropdown', ['ngResource']);
ListDropdown.config(function($httpProvider , $interpolateProvider, $resourceProvider)
    $httpProvider.defaults.xsrfCookieName = 'csrftoken';
    $httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken';
    //** django urls loves trailling slashes which angularjs removes by default.
    $resourceProvider.defaults.stripTrailingSlashes = false;

    //** you can skip these if you want
    $interpolateProvider.startSymbol('[[');
    $interpolateProvider.endSymbol(']]');
    **//
  );

以角度更改您的 post 命令以在 post 对象中包含数据

change

发布时，最好将 args 存储为数据。所以你的 post statement 看起来像 e

$http.post(url, data: test: 'data')

django 视图期待发布请求并访问发布数据。

在你的views.py中：

您应该考虑确保该请求是一个 post 请求，将您的第一个参数命名为 request（为清楚起见），然后您可以通过 POST Dictionary 访问您发送的数据

def escalando(request,args):
   if request.method == 'POST':
       request.POST.get('test') ## show return data.

更多文档：

Django CRSF settings : Django Post Object Angujarjs $http service :

【讨论】：

以上是关于AngularJs 和 Django 的 Ajax 请求的主要内容，如果未能解决你的问题，请参考以下文章

使用 AngularJs 发布请求时未设置 CSRF Cookie - Django 后端

使用 AJAX 设置时未保存 Django 会话变量

无模板 Django + AJAX：Django 的 CSRF 令牌是不是在浏览会话过程中更新？

jquery ajax jsonp 和 angularjs $http json 的区别

Django 和 AngularJS：如何显示来自 Django 调试错误消息的 Angular $http 错误

Django + AngularJS：没有使用普通 URL 和视图的 Django REST 框架的类 REST 端点？