How to create a list of wix media folder images with url and name

Question

Is there a way in wix to get a list of all media files (images) urls and names? I would need this to upload it in a field of the content manager to link data records and images.

Answer 1

You can use the new mediaManager API:

1. From Wix enable the developper mode

2. Go to the code files (icon {} to the left), and create a new backend JS file named 'http-functions.js'

3. Edit this file and add the following code:

   import { ok, badRequest } from 'wix-http-functions';
   import { mediaManager } from 'wix-media-backend';
   
   export function get_filesList(request) {
   
   const response = {
       "headers": {
           "Content-Type": "application/json"
       }
   };
   
   var filters = {};
   var paging = {};
   
   if (request.query) {
    if ('folder' in request.query  ) { //
      filters.parentFolderId = request.query["folder"]; 
    }
    if ('limit' in request.query) {
      paging.limit = request.query['limit'];
    }
    if ('skip' in request.query) {
      paging.skip = request.query['skip'];
    }
   }
   
   return mediaManager.listFiles(filters, null, paging)
    .then((myFiles) => {
      response.body = {
        "filesList": myFiles
      };
      return ok(response);
    })
    .catch((err) => {
       response.body = {
           "error": err
       };
       return badRequest(response);
   });
   }
   
   export function get_listFolders(request) {
   
   const response = {
       "headers": {
           "Content-Type": "application/json"
       }
   };
   var filters = {};
   var paging = {};
   
   if (request.query) {
     if ('folder' in request.query  ) { //
      filters.parentFolderId = request.query["folder"]; 
    }
    if ('limit' in request.query) {
      paging.limit = request.query['limit'];
    }
    if ('skip' in request.query) {
      paging.skip = request.query['skip'];
    }
   }
   return mediaManager.listFolders(filters, null, paging)
    .then((myFolders) => {
      response.body = {
        "foldersList": myFolders
      };
      return ok(response);
    })
    .catch((err) => {
       response.body = {
           "error": err
       };
       return badRequest(response);
   });
   }
   

4. Publish the files

5. You can query your custom API from: https://www.your_website.com/_functions/filesList and https://www.your_website.com/_functions/foldersList and query parameters folderId, skip and limit for pagination.

Wix documentation:

• https://support.wix.com/en/article/velo-exposing-a-site-api-with-http-functions
• https://www.wix.com/velo/reference/wix-media-backend/mediamanager-obj/listfiles