Python django,angular,csrf,剩余框架,403,

Python django,angular,csrf,剩余框架,403,,python,angularjs,django,csrf,Python,Angularjs,Django,Csrf,我正在开发我的第一个项目,在过去的4天里一直被CSRF阻止 我需要尝试并完成的是: 经过身份验证的用户应该向django rest_框架api提交一个角度表单 然后,提交给DjangoAPI的信息应用于向第三方wsdl服务提交soap请求 然后应将响应保存到.pdf文件中,并在页面上呈现 我目前还停留在这个过程的第一点上,甚至还没有开始第2点和第3点作为第1点 错误 Forbidden (CSRF token missing or incorrect.) (function(){ '

我正在开发我的第一个项目,在过去的4天里一直被CSRF阻止

我需要尝试并完成的是:

  • 经过身份验证的用户应该向django rest_框架api提交一个角度表单

  • 然后,提交给DjangoAPI的信息应用于向第三方wsdl服务提交soap请求

  • 然后应将响应保存到.pdf文件中,并在页面上呈现

  • 我目前还停留在这个过程的第一点上,甚至还没有开始第2点和第3点作为第1点

    错误

    Forbidden (CSRF token missing or incorrect.)
    
    (function(){
         'use strict';
        angular.module('formBuilder', [])
          .controller('personSearchController', ['$scope', '$http', personSearchControllerFunction]);
    
           function personSearchControllerFunction($scope, $http){
                $scope.submit = function(idNumber,reference){
                    var person = {
                        list: list.id,
                        idNumber: idNumber,
                        reference: reference,
                    };
                    $http.post('/intelportal/person_search/persons/', person)
                        .then(function(response){
                            list.person.push = (response.data);
                        },
                        function(){
                            alert('Could not create query')
                        });
                };
                $scope.data = [];
                $http.get('/intelportal/person_search/persons/')
                    .then(function(response){
                        $scope.data = response.data;
                    });
           };
    })();
    
    个人搜索\u new.html

    <!DOCTYPE html>
    
    <html lang="en">
    
    {% extends 'base/base.html' %}
    {% block title %}Person Search{% endblock %}
    {% load static %}
    
    
      <body>
    
        <!-- Navigation -->
    
        {% block body %}
    
          <!-- Page Content -->
          <div class="container">
    
            <!-- Page Heading/Breadcrumbs -->
            <h1 class="mt-4 mb-3">Intelligence Portal
              <small>Person Search</small>
            </h1>
    
            {% if user.is_authenticated %}
              <p>
                User: {{ user.get_username }}
              </p>
    
              <ol class="breadcrumb">
                <li class="breadcrumb-item">
                  <a href="{% url 'member:member' %}">Member Zone</a>
                </li>
                <li class="breadcrumb-item">
                  <a href="{% url 'intelportal:intelportal' %}">Intelligence Portal</a>
                </li>
                <li class="breadcrumb-item active">Person Search</li>
              </ol>
    
              <!-- Content Row -->
              <div class="row">
                <!-- Sidebar Column -->
                <div class="col-lg-3 mb-4">
                  {% include 'base/sidebar_template.html' %}
                </div>
                <!-- Content Column -->
                <div class="col-lg-9 mb-4">
                  <h2>Person Search</h2>
                  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Soluta, et temporibus, facere perferendis veniam beatae non debitis, numquam blanditiis necessitatibus vel mollitia dolorum laudantium, voluptate dolores iure maxime ducimus fugit.</p>
    
                  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
                  <script src="{% static 'intelportal/person_search_form_new.js' %}"></script>
                  <script src="{% static 'intelportal/form_builder_config.js' %}"></script>
    
                  <div ng-app="formBuilder">
                      {% csrf_token %}
                      {% verbatim %}
                      <div ng-controller="personSearchController">
                        <div class="form-group">
                            <form class="form-control" action="" method="post" enctype="multipart/form-data">
                                <div class="control-group form-group">
                                    <label>
                                        <input type="radio" ng-model="selectedType" value="idNumber">
                                        ID Number
                                    </label>
                                    <label>
                                        <input type="radio" ng-model="selectedType" value="passportNumber">
                                        Passport Number
                                    </label>
                                    <label>
                                        <input type="radio" ng-model="selectedType" value="initialsSurnameDob">
                                        Initials, Surname and Date of Birth
                                    </label>
                                </div>
                                    <div ng-switch="selectedType">
                                        <div ng-switch-when="idNumber">
                                            <p>
                                                <label>
                                                    ID Number:
                                                    <input type="text" ng-model="idNumberInput" name="idNumber" placeholder="ID Number" ng-required="true">
                                                </label>
                                            </p>
                                            <p>
                                                <label>
                                                    Your Reference:
                                                    <input type="text" ng-model="yourReferenceInput" name="yourReference" placeholder="Your Reference" ng-required="true">
                                                </label>
                                            </p>
                                            <p>
                                                <button ng-click="add(idNumberInput, yourReferenceInput)" type="submit" class="btn btn-primary">Submit</button>
                                            </p>
                                        </div>
                                        <div ng-switch-when="passportNumber">
                                            <p>
                                                <label>
                                                    Passport Number:
                                                    <input type="text" ng-model="passportNumberInput" name="passportNumber" placeholder="Passport Number" ng-required="true">
                                                </label>
                                            </p>
                                            <p>
                                                <label>
                                                    Your Reference:
                                                    <input type="text" ng-model="yourReferenceInput" name="yourReference" placeholder="Your Reference" ng-required="true">
                                                </label>
                                            </p>
                                            <p>
                                                <button ng-click="submit(passportNumberInput, yourReferenceInput)" type="submit" class="btn btn-primary">Submit</button>
                                            </p>
                                        </div>
                                        <div ng-switch-when="initialsSurnameDob">
                                            <p>
                                                <label>
                                                    Initials / Forenames:
                                                    <input type="text" ng-model="initialsInput" name="initials" placeholder="Initials / Forenames" ng-required="true">
                                                </label>
                                            </p>
                                            <p>
                                                <label>
                                                    Surname:
                                                    <input type="text" ng-model="surnameInput" name="surname" placeholder="Surname" ng-required="true">
                                                </label>
                                            </p>
                                            <p>
                                                <label>
                                                    Date of Birth:
                                                    <input type="text" ng-model="dobInput" name="dob" placeholder="Date of Birth" ng-required="true">
                                                </label>
                                            </p>
                                            <p>
                                                <label>
                                                    Your Reference:
                                                    <input type="text" ng-model="yourReferenceInput" name="yourReference" placeholder="Your Reference" ng-required="true">
                                                </label>
                                            </p>
                                            <p>
                                                <button ng-click="submit(initialsInput, surnameInput, dobInput, yourReferenceInput)" type="submit" class="btn btn-primary">Submit</button>
                                            </p>
                                        </div>
                                    </div>
                            </form>
                        </div>
                      </div>
                  </div>
                      {% endverbatim %}
    
                </div>
              </div>
              <!-- /.row -->
    
    
    
            {% else %}
    
              <br>
                <p>
                  This area requires member authentication. Please log in with your authorised member account.
                </p>
                <p>
                  <a href="{% url 'member:login' %}">Go to login</a>
                </p>
              </br>
    
            {% endif %}
    
          </div>
    
        {% endblock %}
    
        <!-- /.container -->
    
        <!-- Footer -->
    
        <!-- Bootstrap core JavaScript -->
    
      </body>
    
    </html>
    
    视图.py

    class PersonSearchView(TemplateView):
        template_name = 'intelportal/person_search_new.html'
        login_required = True
    
    from django.urls import path, include
    from . import views
    from .api import PersonIdNumberViewSet
    from rest_framework.routers import DefaultRouter
    
    
    app_name = 'intelportal'
    
    router = DefaultRouter()
    router.register(r'persons', PersonIdNumberViewSet, base_name='persons')
    
    urlpatterns = [
        path('person_search', views.PersonSearchView.as_view(), name='person_search'),
        path('', views.IntelPortalView.as_view(), name='intelportal'),
        path('person_search/', include(router.urls)),
    
        ]
    
    url.py

    class PersonSearchView(TemplateView):
        template_name = 'intelportal/person_search_new.html'
        login_required = True
    
    from django.urls import path, include
    from . import views
    from .api import PersonIdNumberViewSet
    from rest_framework.routers import DefaultRouter
    
    
    app_name = 'intelportal'
    
    router = DefaultRouter()
    router.register(r'persons', PersonIdNumberViewSet, base_name='persons')
    
    urlpatterns = [
        path('person_search', views.PersonSearchView.as_view(), name='person_search'),
        path('', views.IntelPortalView.as_view(), name='intelportal'),
        path('person_search/', include(router.urls)),
    
        ]
    
    个人搜索\u表单\u new.js(.js controller)

    form\u builder\u config.js(.js config)


    我真的希望有人能解释这一点,因为我没有头发可以拔:)

    {%csrf\u token%}
    应该在内部,但这似乎并不能解决问题。它只将文本{%csrf_-token%}打印到表单中。我删除了{%verbatim%}{%endverbatim%},并将{%csrf_-token%}放在和中,但是现在我得到了以下不允许的错误方法(POST):/intelportal/person_search[07/Jun/2018 12:50:43]“POST/intelportal/person_search HTTP/1.1”4050。我觉得这很奇怪,因为我希望看到/intelportal/person\u search/persons/像get请求“get/intelportal/person\u search/persons/HTTP/1.1”200 61你有没有尝试过这个是的,它的表单是_builder\u config.js