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

2024-03-15

我正在使用精细的上传器插件来上传图像。图片上传工作正常。我想做的是,当图像上传后刷新页面时,精细上传器应该显示以前上传的图像。

这是我的代码..

$('#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 实例(例如页面加载时)时显示以前上传的图像或常规文件,您应该使用“初始文件列表”功能 http://docs.fineuploader.com/branch/master/features/session.html.

为此,您必须提供一个会话端点选项,如下所示:

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

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

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

  • *name:字符串 - 文件的名称。
  • *uuid: String - 文件的 UUID。
  • size: Number - 文件大小(以字节为单位)。
  • deleteFileEndpoint: String - 关联删除文件的端点 要求。如果省略,则使用deleteFile.endpoint。
  • deleteFileParams:对象 - 随对象一起发送的参数 关联的删除文件请求。如果省略,deleteFile.params 是 用过的。
  • thumbnailUrl: String - 文件旁边显示的图像的 URL。
  • *s3Key: String - S3 存储桶中文件的密钥。仅当使用 Fine Uploader S3 时才需要。
  • *s3Bucket: String - S3 中存储文件的存储桶的名称。仅当使用 Fine Uploader S3 并且存储桶不能时才需要 通过检查端点 URL 来确定(例如在路由时 通过 CDN)。
  • *blobName:字符串 - Azure Blob 存储容器中的文件名称。仅当使用 Fine Uploader Azure 时才需要。

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

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 [FINE UPLOADER] 中显示以前上传的图像 的相关文章