장고 렌더링 AJAX JSON

Question

보기에 JSON 개체를 전달하려고합니다. 이 뷰는 템플릿의 JSON 객체를 출력합니다. 이것은 장고에서 어떤 데이터를 전달하는지보기위한 테스트 일뿐입니다.

JSON 개체가 전송되기 전에 전송되는 데이터의 유효성을 검사하는 javascript가 있습니다. 유효성 검사가 통과되면 데이터는 AJAX를 통해 전송됩니다.

현재 원하는보기로 보낼 항목을 가져올 수 없습니다. POST에 대해 403이 표시됩니다. https://gist.github.com/liondancer/a9df593daeeecce7f180

JS :

$(document).ready(function() { 
    // Data to describe what kind of test 
    var testData = { 
     "timestamp": "", 
     "hive": 0, 
     "hdfs": 0, 
     // Contains a list of testData objects 
     "beacons":[] 
    }; 


    var testRun = document.getElementById("test-form"); 
    testRun.addEventListener('submit', function(event) { 
     event.preventDefault(); 
     var selectedTest = document.querySelector('input[name=test-select]:checked'); 
     alert(selectedTest); 
     var testType = selectedTest.id; 
     if (testType == "hdfs-test") { 
      testData["hdfs"] = 1; 
      testData["hive"] = 0; 
     } else if (testType == "hive-test") { 
      testData["hdfs"] = 0; 
      testData["hive"] = 1; 
     } else if (testType == "hdfs-hive-test") { 
      testData["hdfs"] = 1; 
      testData["hive"] = 1; 
     } else { 
     // null 
     } 

     var events = document.getElementById("event-textarea").value; 
     // check in valid input 
     var eventSource = events.replace("],[","],,,,["); 
     // beaconLists allows users to submit --> [{beacon1}, {beacon2}, ...], [{beacon3}, {beacon4}, ...] 
     var beaconLists = eventSource.split(",,,,"); 
     for (var i = 0; i < beaconLists.length; i++) { 
      // inspect one list in beaconLists [{beacon1}, {beacon2}, ...] 
      var beaconList = beaconLists[i]; 
      try { 
       // list of JSON objects 
       var beaconObjList = JSON.parse(beaconList); 
       for (var j = 0; j < beaconObjList.length; j++) { 
        var beaconObj = beaconObjList[j]; 
        if (beaconObj["data"] && beaconObj["application"]) { 
        // successful parse to find events 
        // describe beacon being tested 
         alert("yes"); 
         var beacon = { 
          "app_name": beaconObj["application"]["app_name"], 
          "device": beaconObj["application"]["device"], 
          "device_id": beaconObj["application"]["device_id"], 
          "os": beaconObj["application"]["os"], 
          "os_version": beaconObj["application"]["os_version"], 
          "browser": beaconObj["application"]["browser"], 
          "beacon": beaconObj 
         }; 
         // append to testData 
         testData["beacons"].push(beacon); 
         // reset beacon so we can append new beacon later 
         beacon = {}; 
        } else { 
        // notify event isn't in the correct format? 
         alert("no"); 
        } 
       } 
      } catch (e) { 
      //  notify bad JSON 
       alert("failed"); 
      } 
     } 
     console.log(testData); 
     //$.ajaxSetup({ 
     // beforeSend: function(xhr, settings) { 
     //  if (!csrfSafeMethod(settings.type) && !this.crossDomain) { 
     //   xhr.setRequestHeader("X-CSRFToken", csrftoken); 
     //  } 
     // } 
     //}); 
     $.ajax({ 
      type: "POST", 
      url: "/test/", 
      data: testData, 
      success: function() { 
       alert("yay"); 
      }, 
      failure: function() { 
       alert("boo"); 
      } 
     }); 
    }); 
}); 

HTML :

{% extends 'index/index.html' %} 

{% load staticfiles %} 
{% block head %} 
    <script type="text/javascript" src="{{ STATIC_URL }}home/js/home.js" async></script> 
    <link href="{{ STATIC_URL }}home/css/home.css" rel="stylesheet"> 
{% endblock head %} 

{% block content %} 

    <div>Welcome to Trinity E2E testing</div> 

    <form id="test-form"> 
    {% csrf_token %} 
    <input id="hdfs-test" type="radio" name="test-select" class="btn btn-default btn-lg">HDFS 
    <input id="hive-test" type="radio" name="test-select" class="btn btn-default btn-lg">HIVE 
    <input id="hdfs-hive-test" type="radio" name="test-select" class="btn btn-default btn-lg">BOTH 

    <textarea id="event-textarea" rows="8" class="form-control" placeholder="Events..."></textarea> 

    <input id="submit-test" type="submit" class="btn btn-default btn-lg" value="Submit"> 
    </form> 

{% endblock content %} 

홈/views.py :

from django.shortcuts import render 

def load_homepage(request): 
    return render(request, 'home/home_page.html', '') 

def scan_events(request): 
    if request == "POST": 
     # json = request.POST['testData'] 
     # condition statement for file upload ot c/p events 
     return render(request, 'home/test.html', {'data': request.POST}) 

여기

[22/Dec/2014 21:36:52] "POST /test/ HTTP/1.1" 403 2295 

내 코드의 요점이다 617,451,515,

인 test.html :

{{ data }} 

urls.py :

urlpatterns = patterns('', 
    url(r'^admin/', include(admin.site.urls)), 
    url(r'parser/', include("parser.urls", namespace="parser")), 
    url(r'^$', 'home.views.load_homepage', name='home'), 
    # url(r'form_data', 'parser.views.form_handler', name='') 
    url(r'test/$', 'home.views.scan_events'), 
) 

Answer 1

시도 토큰 CSRF를 보낼

당신은 CSRF 토큰