javascript - 在 Django 中处理没有表单的 Ajax 请求

Question

我的 html 中有一个内容列表，其中包含一个 ajax 请求，用于将数据测量值传递给views.py:

<ul>
   <li><a class="measure" href="#" data-measure="m_0001">Measure_0001</a></li>
   <li><a class="measure" href="#" data-measure="m_0002">Measure_0002</a></li>
   <li><a class="measure" href="#" data-measure="m_0003">Measure_0003</a></li>
</ul>

Javascript

$(".measure").click(function(){
var measure = {'measure': this.getAttribute("data-measure")};
$.ajax({
    url : "prueba/", // the endpoint
    type : "POST", // http method
    data : measure,

    success : function (data) {
         //Success 
    }
});

在此文件中 views.py 我想获取对数据库进行查询的值。

def prueba(request):
  response_data =  '{}'
  if request.user.is_authenticated:
    if request.method == 'POST':
      measure = request.POST.get('measure', None)
      //request to database

      return JsonResponse(response_data, safe=False)
    else:
      response_data =  '{"nothing to see": "this is not happening"}'
      return JsonResponse(response_data, safe=False)

当我单击列表中的项目时，出现此错误:

“禁止(CSRF token 丢失或不正确。)”

我不明白我必须将 csrf_token 放在哪里才能使其工作。

有什么建议吗？

Answer 1

在 ul 标记内添加一个隐藏的输入元素，其值为 {{ csrf_token }}，如下所示:

<ul>
  <input type='hidden' name='csrfmiddlewaretoken' value='{{ csrf_token }}' />        
  <!-- your list elements -->
</ul>

然后在你的 jQuery 中执行以下操作:

$("ul .measure").on('click',function(){        
    var measure = {
        'measure': this.getAttribute("data-measure"),
        'csrfmiddlewaretoken': $('input[name=csrfmiddlewaretoken]').val()
       };
    // your ajax call
 });