javascript - 在[FINE UPLOADER]中显示以前上传的图像

我正在使用优质的Uploader插件上传图片。图片上传正常。我想做的是在图像上传后页面刷新时，精细上传器应显示以前上传的图像。

这是我的代码。

$('#accordion').on('shown.bs.collapse', function () {
    activeShopId1 = $(".collapse.in").attr("id");

    $('#' + activeShopId1 + '  #fine-uploader-gallery' + '.single-image').fineUploader({
        template: 'qq-template-gallery',
        request: {
            endpoint: 'upload_internal_image'
        },

        validation: {
            allowedExtensions: ['jpeg', 'jpg', 'gif', 'png'],
            itemLimit: 1
        },
        messages: {
        tooManyItemsError: 'You can only add 1 image'
            },
        deleteFile: {
            enabled: true,
            forceConfirm: true,
            endpoint: 'delete_internal_image'
        },
        callbacks: {
            onSubmit: function (id, fileName) {
                this.setParams({shop_id: shopId4Map});
            },
        },
    });

})

提前致谢。

最佳答案

要在创建新的Fine Uploader实例时(例如在页面加载时)显示以前上传的图像或常规文件，应使用"initial file list" feature。

为此，您必须提供 session 端点选项，如下所示:

session: {
   endpoint: '/initial/files'
}

Fine Uploader将向此端点发送GET请求，并且您的服务器必须使用JSON数组进行响应，该JSON数组包含表示要在列表中显示的每个文件的对象。

以下是Fine Uploader可以识别的每个对象的以下属性(* =必填):

* name:字符串-文件名。

* uuid:字符串-文件的UUID。

size:数字-文件大小，以字节为单位。

deleteFileEndpoint:字符串-关联的删除文件的端点
要求。如果省略，则使用deleteFile.endpoint。

deleteFileParams:对象-与参数一起发送的参数
关联的删除文件请求。如果省略，则deleteFile.params为
用过的。

thumbnailUrl:字符串-要显示在文件旁边的图像的URL。

* s3Key:字符串-S3存储桶中文件的 key 。仅在使用Fine Uploader S3时才需要。

* s3Bucket:字符串-文件在S3中存储的存储桶的名称。仅在使用Fine Uploader S3且存储桶无法使用时才需要
通过检查端点URL来确定(例如，路由时)
通过CDN)。

* blobName:字符串-Azure Blob存储容器中文件的名称。仅当使用Fine Uploader Azure时才需要。

响应将转换为JavaScript数组，并传递给sessionRequestComplete事件处理程序。因此，随服务器响应传递的任何非标准对象属性也将传递给事件处理程序。

关于javascript - 在[FINE UPLOADER]中显示以前上传的图像，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/35716417/