[英]jQuery $_FILES array empty with blueimp file upload plugin in IE8/9
[英]Blueimp jQuery File Upload plugin - "Empty file upload" result PHP
这是插件: https : //github.com/blueimp/jQuery-File-Upload
上传文件后,我在从插件中获取我想要的响应时遇到问题。
在带有插件的页面上,我有以下内容
$('#fileupload').fileupload(
'option',
{
'maxNumberOfFiles' :1,
'url' : '/admin/upload_handler.php'
}
);
在upload_handler.php
我成功地从$_FILES 中检索了上传的文件并执行操作,然后以JSON 格式返回响应。 我已经使用 Firebug 确认响应的格式正确:
[
{
"url" : "image_url",
"thumbnail_url" : "image_th_url",
"delete_url" : "test",
"delete_type" : "DELETE",
"name" : "foobar.jpg",
"size" : 7419
}
]
但是回调找不到文件数组,我收到错误:“空文件上传结果”。 我觉得我在这里遗漏了一些重要的东西——我在文档、论坛或 Stack Overflow 中找不到任何东西。 我很感激任何帮助。
从插件的第 5 版开始,json 响应发生了变化: https : //github.com/blueimp/jQuery-File-Upload/wiki/JSON-Response
所以你只需调整你的上传类:
$filejson = new stdClass();
$filejson->files[] = $fileArray;
return json_encode($filejson);
你已经完成了
您的返回需要包含在一个 files 数组中,如下所示:
{"files": [
{
"name": "picture1.jpg",
"size": 902604,
"url": "http:\/\/example.org\/files\/picture1.jpg",
"thumbnailUrl": "http:\/\/example.org\/files\/thumbnail\/picture1.jpg",
"deleteUrl": "http:\/\/example.org\/files\/picture1.jpg",
"deleteType": "DELETE"
},
{
"name": "picture2.jpg",
"size": 841946,
"url": "http:\/\/example.org\/files\/picture2.jpg",
"thumbnailUrl": "http:\/\/example.org\/files\/thumbnail\/picture2.jpg",
"deleteUrl": "http:\/\/example.org\/files\/picture2.jpg",
"deleteType": "DELETE"
}
]}
特别是,要求是: Note that the response should always be a JSON object containing a files array even if only one file is uploaded.
将 HTML(以及编程结果 DOM)对象添加到 <tr class="template-upload fade"> HTML 标记之外的模板时,将出现“空文件上传结果”,例如:假设您添加另一个 < tr> 到模板
这将导致文件被正确上传,并且对于每个上传的文件,您将获得一次“空文件上传结果”。
好像还得用JS模板引擎做点什么。
这可以在 jquery.fileupload-ui,js 中修复,就在第 128 行之后
原始代码:
// Callback for successful uploads:
done: function (e, data) {
var that = $(this).data('blueimp-fileupload') ||
$(this).data('fileupload'),
files = that._getFilesFromResponse(data),
template,
deferred;
if (data.context) {
data.context.each(function (index) { // LINE 128
var file = files[index] ||
{error: 'Empty file upload result'},
deferred = that._addFinishedDeferreds();
在第 128 行后添加以下代码:
if (!$(data.context[index]).hasClass(that.options.uploadTemplateId)) { return true; }
结果代码:
// Callback for successful uploads:
done: function (e, data) {
var that = $(this).data('blueimp-fileupload') ||
$(this).data('fileupload'),
files = that._getFilesFromResponse(data),
template,
deferred;
if (data.context) {
data.context.each(function (index) { //LINE 128
if (!$(data.context[index]).hasClass(that.options.uploadTemplateId)) { return true; } // YOUR ADDED LINE
var file = files[index] ||
{error: 'Empty file upload result'},
deferred = that._addFinishedDeferreds();
希望这对其他人有帮助:)
好吧,这似乎不是 jQuery 问题,而是服务器端问题。 就我而言,它是一个 PHP 脚本,需要进行如下调整。
见函数 post(),编辑这一行
$json = json_encode($info);
到
$json = json_encode(array($this->options['param_name'] =>$info));
我还必须在函数的最后一行编辑回声; 代替
echo $json;
现在有
echo str_replace('\/','/',$json);
返回正确的 json 数组似乎工作正常。 希望能帮助到你。
就我而言,我修改了 jquery.fileupload-ui.js 文件以直接查找 JSON 结果。
更改此代码段
if (data.context) { data.context.each(function (index) { var file = files[index] || {error: 'Empty file upload result'};//CHANGE deferred = that._addFinishedDeferreds(); that._transition($(this)).done( function () {
至此
if (data.context) { data.context.each(function (index) { var file = data._response.result[index] || {error: 'Empty file upload result'};//TO THIS deferred = that._addFinishedDeferreds(); that._transition($(this)).done( function () {
如前所述,发生这种情况是因为服务器响应不是插件所期望的(这是一个文件数组,如下所示)。 如果您不想(或不能)想要更改后端,则解决方案是将响应中的结果对象替换为插件期望的结果对象(然后包含文件数组)。
这可以在fileuploaddone事件中完成。
data.result保存服务器响应:
.bind('fileuploaddone', function(e, data) {
//this will now contains the server response
//as per the attached image: an array of elements
data.result;
});
我们想用一个可以被 blueimp 插件解析的新对象替换结果对象,让我们定义它(注意:这是一个包含文件数组的对象,根据插件文档)。
//tempFolder is optional
var filesUploaded = { "files": [], "tempFolder": null };
替换结果对象:
.bind('fileuploaddone', function(e, data) {
//creating a file object in the format the jquery plugin is expecting
var file = {
deleteType: "DELETE",
deleteUrl:"#",
type: data.result[0].MimeType,
thumbnailUrl : "#",
url: "#",
name: data.result[0].Name,
size: data.result[0].Size
}
//adding it to the file list
filesUploaded.files.push(file);
data.result = null;
//replacing the server response with the 'custom' one we just created
data.result = filesUploaded;
});
该插件现在应该可以正常呈现,因为它将解析预期的 JSON 模式,并且您不会再收到“空文件上传结果”消息。
对我来说,这是上传文件的大小。 我调整了那些 php.ini 参数:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.