9

这是插件：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 中找不到任何东西。我很感激任何帮助。

4

7 回答 7

4

自插件版本 5 起，json 响应发生了变化：https ://github.com/blueimp/jQuery-File-Upload/wiki/JSON-Response

所以你只需调整你的上传类：

$filejson = new stdClass();
$filejson->files[] = $fileArray;
return json_encode($filejson);

你完成了

于 2013-07-26T22:48:14.413 回答
4

您的回报需要包含在文件数组中，如下所示：

    {"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.

通过 :: https://github.com/blueimp/jQuery-File-Upload/wiki/Setup#using-jquery-file-upload-ui-version-with-a-custom-server-side-upload-handler

于 2015-01-20T03:48:39.030 回答
2

“空文件上传结果”将在向 <tr class="template-upload fade"> HTML 标签之外的模板添加 HTML（和编程结果 DOM）对象时发生，例如：假设您添加另一个 < 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();

希望这对其他人有帮助:)

于 2013-05-21T12:08:32.193 回答
0

好的，这似乎不是 jQuery 问题，而是服务器端问题。就我而言，它是一个 PHP 脚本，需要进行如下调整。

见函数 post()，编辑这一行

$json = json_encode($info);

至

$json = json_encode(array($this->options['param_name'] =>$info));

而且我还必须在函数的最后一行编辑回声；代替

echo $json;

现在有

echo str_replace('\/','/',$json);

返回正确的 json 数组似乎可以正常工作。希望能帮助到你。

于 2013-01-16T08:53:11.283 回答
0

就我而言，我修改了 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 () {

于 2015-07-17T16:51:47.183 回答
0

对我来说，这是上传文件的大小。我调整了那些 php.ini 参数：

  • 内存限制
  • post_max_size
  • 上传最大文件大小
  • max_file_uploads
于 2021-09-06T15:25:58.720 回答
0

如前所述，发生这种情况是因为服务器响应不是插件所期望的（这是一个文件数组，如此处所示）。如果您不想（或不能）更改后端，解决方案是将响应中的结果对象替换为插件期望的结果对象（然后包含文件数组）。

这可以在fileuploaddone事件中完成。

假设这是上传完成后从服务器返回的 JSON 响应： 在此处输入图像描述

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 模式，并且您不会再收到“空文件上传结果”消息。

于 2017-02-28T17:19:24.653 回答