如何使用带有 ajax 的 DJANGO REST 框架发出 POST 请求

Posted 2023-02-24

【中文标题】如何使用带有 ajax 的 DJANGO REST 框架发出 POST 请求

【英文标题】：How to make a POST request using DJANGO REST framework with ajax

【发布时间】：2017-05-17 20:38:17

【问题描述】：

这是我的模型类：

    class PoliceAssurance(models.Model):
        Numpolice = models.IntegerField()
        Raison = models.CharField(max_length=50)
        Tel = models.IntegerField()
        Email = models.CharField(max_length=50)

这是我的序列化程序：

    class PoliceSerializer(serializers.ModelSerializer):        
        class Meta:
            model = PoliceAssurance
            fields = ('Numpolice','Raison','Tel','Email');

现在，我需要通过 AJAX 调用发出 POST 请求。谁能提供有关我如何处理此任务的信息？

这是我的观点.py

@login_required(login_url="login/")
def home(request):
    return render(request,"home.html")

class PoliceViewset(generics.ListCreateAPIView):    
    queryset = PoliceAssurance.objects.all()
    serializer_class =  PoliceSerializer    

还有我的 urls.py

    urlpatterns=[
    url(r'^$', views.home, name='home'),
    url(r'PoliceAssurance',views.PoliceViewset.as_view(),              name='PoliceAssurance'),
    ]

这是我的 ajax 请求

$(#suit).click(function()          

    var data = ;
    data.Numpolice = $(#num).val();
    data.Raison = $(#raison).val();
    data.Tel = $(#tel).val();
    data.Email = $(#email).val();

    $.ajax(
        type: "POST",
        url: "/PoliceAssurance/",
        data: data,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(data)
            alert(data);
        ,
        failure: function(errMsg) 
            alert(errMsg);
        
    );
);

【问题讨论】：

这是相当广泛的。你在前端使用什么？您是否打算使用一些框架，例如 jquery、angular 等？ ***.com/questions/20306981/…

我在前端使用jquery+reactJs+html

你有意见吗？如果没有，您将需要一个和一个 url 路由来配合它。如果是这样，您可以发布代码吗？

我发布了代码@ChidG 现在我在发出 ajax 请求以发布数据时遇到问题

还有什么问题？调用该 ajax 代码时会发生什么？如果您实际上不说出问题所在，就很难为您提供帮助。我可以看到的一个问题是您的 jquery 选择器正在使用可能未定义的变量。通常你需要使用$('#suit')。而不是 $(#suit)，除非您已将 #suit 定义为变量，并且对于您的其他 jquery 选择器也是如此。

【参考方案1】：

您可能需要在此链接中查看 http://www.django-rest-framework.org/topics/ajax-csrf-cors/#javascript-clients 和 django 文档（详细信息），我的代码非常适合我

$.ajax(
    url: 'your web url',
    type: 'POST',
    beforeSend: function (xhr, settings) 
        xhr.setRequestHeader("X-CSRFToken", ' csrf_token ');
    ,
    success: function (arg) 
        location.reload()
    
)

Django rest 框架不像普通的 django 那样工作。您需要将数据中的“csrfmiddlewaretoken”转换为RequestHeader中的“X-CSRFToken”或“HTTP-X-CSRFToken”

【参考方案2】：

您可能需要将 CSRF 信息与 Ajax 请求一起发送，或者免除您的视图。见here。如果你在 ajax 中包含这个 beforeSend 函数，它就可以解决问题：

    $.ajax(
          type: "POST",
          ...
          beforeSend: function(xhr, settings) 
                  if (!csrfSafeMethod(settings.type) && !this.crossDomain) 
                          xhr.setRequestHeader("X-CSRFToken", % csrf_token %);
               
          ,
          ...

假设 javascript 是模板的一部分，则 csrftoken 可以通过 % csrf_token % 选择。

希望这会有所帮助。