最近我一直试图解决一个问题,但没有运气,基本上我试图使用 AJAX 向服务器提交一个表单,表单中有文件,所以我使用JQuery 1.12中的FormData
javascript对象。数据到达服务器,但我不知道如何格式化它。
这是我的 AJAX 函数:
function saveMenu(id){
var formElement = document.getElementById("menu-form");
var formData = new FormData(formElement);
formData.append('_method', 'PUT');
$( "#form-wrapper" ).toggleClass( "be-loading-active" );
$.ajax({
type: 'PUT',
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
url: "{{url('myUrl')}}",
data: formData,
enctype: 'multipart/form-data',
processData: false,
success: function(response) {
toastr.success('Yai! Saved successfully!')
},
error: function(response) {
toastr.error('Oh oh! Something went really wrong!')
},
complete: function() {
$( "#form-wrapper" ).toggleClass( "be-loading-active" )
}
});
}
当我在控制器中执行dd($request->all());
时,我会得到这样的结果:
array:1 [
"------WebKitFormBoundaryRCIAg1VylATQGx46\r\nContent-Disposition:_form-data;_name" => """
"_token"\r\n
\r\n
jtv4bnn8WQnP3eqmKZV3xWka2YOpnNc1pgrIfk0D\r\n
------WebKitFormBoundaryRCIAg1VylATQGx46\r\n
Content-Disposition: form-data; name="blocks[43][title]"\r\n
\r\n
...
我尝试过的事情:
- 将HTTP predicate 设置为POST。结果相同。
- 设置 AJAX
contentType: false
,contentType: application/json
。空响应。 - 删除
enctype: 'multipart/form-data'
。相同的响应。
任何帮助都很感激。
6条答案
按热度按时间6tr1vspr1#
这个帮我修好了
processData: false
防止jQuery解析数据并抛出Illegal Invocation错误。当jQuery遇到表单中的文件并且无法将其转换为字符串(序列化它)时,它会这样做。contentType: false
阻止 AJAX 发送内容类型头。内容类型头使Laravel将FormData Object处理为一些序列化的字符串。将两者都设置为false使它对我起作用。我希望这对你有帮助。
还记得使用
$request->all();
$request->input()
排除文件sycxhyv72#
我已经试着调试了2个小时,我发现方法PUT不能正确地与formData一起工作。
试着改变
进入
然后将你的后端方法从
put
改为post
,你会看到不同。在我的控制器里
我会尝试对这个问题进行更多的研究。
lokaqttq3#
Laravel 7中,如果 AJAX 中使用PUT方法,可以按照1.将方法
method: 'PUT'
改为method: 'POST'
2.添加formdata.append with _method PUT像这个例子:它对我很有效
idfiyjo84#
最后,我放弃了尝试让它工作,并尝试了一个更普通的方法,我仍然不知道为什么请求是这样的格式,但
XMLHttpRequest()
函数工作得很好,迁移不是一个大问题。我发布的函数的等价物是:
chhqkbe15#
有点晚了,但是;这会解决你的问题;
然后你可以把这个
object
发送到服务器。这样可读性更好,效果也很好。或
您可以直接发送此;
这是一种新的方法。不要给予:-)
nfeuvbwi6#
如果你得到这样回应
Array([------WebKitFormBoundaryZHCPkXfouoiFpLDg Content-Disposition:_form-data;_name] =〉“mencomentid”43 ------WebKitFormBoundaryZHCPkXfouoiFpLDg Content-Disposition:form-data; name=“mmencomentid”39 -----WebKitFormBoundaryZHCPkXfouoiFpLDg Content-Disposition:form-data; name=“replymencomment”asd ------WebKitFormBoundaryZHCPkXfouoiFpLDg Content-Disposition:form-data; name=“video”-----WebKitFormBoundaryZHCPkXfouoiFpLDg Content-Disposition:form-data; name=“file”;filename="”Content-Type:application/octet-stream ------WebKitFormBoundaryZHCPkXfouoiFpLDg Content-Disposition:form-data; name=“音频”;filename="”Content-Type:application/octet-stream -----WebKitFormBoundaryZHCPkXfouoiFpLDg--)
then cache:false,processData:false,contentType:假的,
添加这些内部请求可以帮助我