[英]Laravel 5 - AJAX image upload with CSRF protection
我已設置要上傳圖片的表單。 我以前使用的是DropZone.js,它工作正常,並與ajax調用一起發送了CSRF令牌。 一切服務器端都很好,但是當嘗試在沒有DropZone的情況下執行此操作時,出現令牌不匹配錯誤。
這是我的AJAX呼叫:
$(document).on('submit', ".hidden-image-upload", function(e){
e.preventDefault();
$.ajax({
url:'/project/uploadImage',
data:{
data:new FormData($("#upload_form")[0]),
},
dataType:'json',
async:false,
type:'post',
processData: false,
contentType: false,
success:function(response){
console.log(response);
},
});
});
這是HTML:
<form method="POST" action="http://localhost/project/create" accept-charset="UTF-8" class="hidden-image-upload">
<input name="_token" type="hidden" value="5lgtt8AgbeF3lprptj8HNXVPceRhoJbqBeErBI1k">
<input class="cover-image-upload-button" name="file" type="file">
</form>
我該如何整理我的AJAX呼叫/ Laravel以便一起工作?
您可以使用$ .ajax在標頭中發送令牌。
$(document).on('submit', ".hidden-image-upload", function(e){
e.preventDefault();
$.ajax({
url:'/project/uploadImage',
data:{
data:new FormData($("#upload_form")[0]),
},
headers: {
'X-CSRF-Token': $('form.hidden-image-upload [name="_token"]').val()
}
dataType:'json',
async:false,
type:'post',
processData: false,
contentType: false,
success:function(response){
console.log(response);
},
});
});
在最壞的情況下,禁用該路由中的CSRF檢查,只需將路由添加到$ app數組中,除了app / Http / Middleware / VerifyCsrfToken.php內
嘗試這個。 您還必須將CSRF令牌與FormData一起傳遞:
$(document).on('submit', ".hidden-image-upload", function(e){
e.preventDefault();
var data = new FormData($("#upload_form")[0]);
data.append('_token', $('input[name="token"]').val());
$.ajax({
url:'/project/uploadImage',
data:{
data: data,
},
dataType:'json',
async:false,
type:'post',
processData: false,
contentType: false,
success:function(response){
console.log(response);
},
});
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.