Showing previously uploaded images in [FINE UPLOADER]

Question

I use the Fine Uploader plugin to upload images. Image loading is working fine. What I'm trying to do is when the page refreshes after the image loading is a great download, it should show previously uploaded images.

Here is my code ..

$('#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}); }, }, }); }) 

Thanks in advance.

Answer 1

To display previously downloaded images or shared files when creating a new Fine Uploader instance (for example, when loading a page), you must use the "start file list".

To do this, you must specify a session endpoint parameter, for example:

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

Fine Uploader will send a GET request to this endpoint, and your server should respond with a JSON array containing objects that represent each file that will be displayed in the list.

The following are the properties of each object that Fine Uploader (* = required) recognizes:

• * name : String - file name.
• * uuid : String - The UUID of the file.
• size : Number - The file size in bytes.
• deleteFileEndpoint : String - The endpoint for the associated request delete file. If omitted, deleteFile.endpoint is used.
• deleteFileParams : Object - parameters to send along with the request to delete the file associated with it. If omitted, deleteFile.params is used.
• thumbnailUrl : String - The URL of the image to display next to the file.
• * s3Key : String - The file key in your S3 bucket. Only required when using Fine Uploader S3.
• * s3Bucket : String - the name of the bucket where the file is stored in S3. Only required when using Fine Uploader S3, and if the bucket cannot be determined by examining the endpoint URL (for example, when routing via CDN).
• * blobName : String - The name of the file in the Azure Blob storage container. Only required when using Fine Uploader Azure.

The response will be converted to a JavaScript array and passed to your sessionRequestComplete event handler. Thus, any non-standard properties of the object transmitted with the response of your server will also be transferred to your event handler.