使用 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/
我是 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/