使用 ajax 发布表单数据在 django 中有 csrf 错误

posting formdata with ajax has csrf error in django

我是 ajax 和 django 的新手,我正在尝试使用 formdata 和 ajax 以表单形式发送文件,但我遇到了 csrf 令牌丢失错误,我已经搜索了很多但无法解决这个问题 problem.Should 我使用 cookies?如果是,如何使用?我真的需要 help.My 代码在这里:

urls.py

...

url(r'^administration/library/add_ebook/ajax/$',upload_ebook_ajax, name='upload_ebook_ajax'),

...

forms.py

class EbookForm(forms.ModelForm):
    class Meta:
        model = Ebook
        fields = ('ebook_title', 'ebook_publisher','ebook_publication_date','ebook_Type','ebook_keywords','ebook_preview','ebook_url','ebook_categories', )

views.py

@transaction.atomic()
def upload_ebook_ajax(request):

if request.method == 'POST':
    form = EbookForm(request.POST, request.FILES)
    if form.is_valid():

        form.save()
        data['form_is_valid'] = True

    else:
        data['form_is_valid'] = False
else:
    form = EbookForm()

context = {'form': form}
data['html_form'] = render_to_string('upldebook.html',context,request=request)
return JsonResponse(data)

upldebook.html

{% load crispy_forms_tags %}
{% crispy form %}

add_ebook.html

<div class="c">
                    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
                    <script src="{% static 'js/jquery-file-upload/vendor/jquery.ui.widget.js' %}"></script>
                    <script src="{% static 'js/jquery-file-upload/jquery.iframe-transport.js' %}"></script>
                    <script src="{% static 'js/jquery-file-upload/jquery.fileupload.js' %}"></script>
                <form method="post" enctype="multipart/form-data" action="{% url 'upload_ebook_ajax' %}" class="js-upload-ebook-form">
                    {% csrf_token %}

                    <div class="frmclass"></div>



                <script src="{% static 'uploadebook.js' %}"></script>


                    <button type="submit">Upload</button>
                    </form>
                </div>

uploadebook.js

//for showing form
 $.ajax({
      url: '/administration/library/add_ebook/ajax',
      type: 'get',
      dataType: 'json',
      success: function (data) {
        $(".frmclass").html(data.html_form);
      }
    });
//for form submit
    $(".js-upload-ebook-form").submit( function (e) {
    e.preventDefault();
    var frmdt = new FormData($('form').get(0)); //I don't know what is 'form' :|
    frmdt.append('csrfmiddlewaretoken', '{{ csrf_token }}');
    $.ajax({
    url: $(this).attr('action'),
    type: $(this).attr('method'),
    data: frmdt,
    cache: false,
    processData: false,
    contentType: false,
    dataType: 'json',
    success: function(data) {
        alert("SUCCESS1");
        window.location = "/"
    }

    });
    return false;
    });

我使用的一个解决方案是将 @csrf_exempt 添加到您的 ajax 方法中(这可能会降低安全性):

from django.views.decorators.csrf import csrf_exempt

@csrf_exempt
def upload_ebook_ajax(request):
    # your code

序列化数据字段,token会一起发布

data: frmdt.serialize(), 

阅读此 SO post 页面了解更多信息,您的答案可能就在那里

{% csrf_token %} 在您的表单中放置了一个隐藏的 html 输入,因此如果您只是使用原始输入的表单,它应该可以工作。

data: $(this).serialize();

我只需要这个:

data:  new FormData(this)

现在可以使用了。

多亏了这个link: http://phppot.com/php/php-ajax-image-upload/