iOS 和 iPad 中的精细上传器

Question

我检查了 Fineuploader 是否在 iPad 上工作，而且大部分情况下都可以，但 iPad 只返回一个文件“image.jpg”，所以上传的每个文件都会覆盖之前的文件。 （或者它只是上传一个文件） 无论如何，这种行为可以在 iPad 上的 Chrome 或 Safari 上修复吗？

我们正在使用库为不同的业务需求上传图片，其作品如梦如幻。感谢开发这个。

奎师那

这是我的代码：

我正在动态创建端点并为不同的文件夹上传文件。它正在为除 iOS 之外的其他平台上传。

$(document).ready(function () {
    $('#s3-fileuploader').fineUploader({
        request: {
            endpoint: '',
            inputName: 'filename',
            forceMultipart: true,
            paramsInBody: true,
            params: {},
        },
        failedUploadTextDisplay: {
            mode: 'custom',
            maxChars: 40,
            responseProperty: 'error',
            enableTooltip: true
        },
        cors: {
            expected: true, //all requests are expected to be cross-domain requests
            sendCredentials: false, //if you want cookies to be sent along with the request
            allowXdr: true
        },
        autoUpload: true,
        multiple: true,
        debug: true,
        text: {
            uploadButton: '<i class="icon-plus icon-white">Select Files</i> '
        },
        deleteFile: {
            enabled: false,
            forceConfirm: true,
        },
        validation: {
            // allowedExtensions: ['jpeg', 'jpg', 'gif', 'png'],
            itemLimit: 75
        }
    }).on('submit', function (event, id, name) {
        $(this).fineUploader('setEndpoint', endPoint); //set endpoint
    }).on('complete', function (event, id, fileName, response) {
        var $deleteEl = $(
            '<span class="delete">&#160;&#160;<a href="javascript:;" onclick="deleteFile(\'' +
            response.deleteFileUrl + '\',\'' + id +
            '\')">Delete</a></span>&#160;&#160;');
        //when you delete element is clicked, call the "deleteFile" API method, passing in that file's ID
        if (response.success) {
            $(".qq-uploader").append(
                '<div class="highlight" style="margin-top:8px;margin-right:8px;float:left;width:180px;height:194px; box-shadow:1px 0 0 #F3F3F3, 0 1px 0 #E4E4E4, 0 -1px 0 #F3F3F3, -1px 0 0 #F3F3F3" class="thumb" id="thumb_' +
                id + '"></div>');
            //get file name from responce
            var filename = getFileName(response.getThumbnailUrl);
            //get file extension now
            var fileExt = filename.split('.').pop().toLowerCase();
            //create array of all available extenions images
            var exts = ["csv", "doc", "docx", "xls", "zip", "pdf",
                "txt"
            ];
            //check if its a image
            if (fileExt == 'jpeg' || fileExt == 'jpg' || fileExt ==
                'png' || fileExt == 'gif' || fileExt == 'tiff' ||
                fileExt == 'tif' || fileExt == 'bmp' || fileExt ==
                'wbmp') {
                //myother logic
            }
        }
    });
});

Answer 1

这是由于 iOS 的设计，而不是 Fine Uploader。看，iOS 为您命名文件——确切地说是“image.jpg”。

Fine Uploader 通过生成 4 级 UUID 并将其与上传请求一起发送来缓解此问题。在请求正文中查找的参数是qquuid。

我猜您的服务器仅根据文件名保存文件。更强大的解决方案是使用文件的 UUID 和文件名的组合来确保用户不会覆盖已经存在的文件。

您的服务器可以在文件名前添加 UUID：

4A0BC570-0125-11E3-B778-0800200C9A66_image.jpg

或创建一个全新的文件夹：

4A0BC570-0125-11E3-B778-0800200C9A66/image.jpg

这不仅可以确保在 iOS 上上传的用户不会覆盖彼此的文件，而且还可以确保 any 平台上的两个用户上传两个同名的不同文件'不要踩对方的脚趾头。

如果您有任何服务器端/客户端代码想要分享，我可以查看、修改并在此处发布我的答案。