How can I use File Response to create array an array of images?

I want to display images that users upload to storage/uploads/ folder which is outside of the website's root folder (Because I don't want other users to have access to each other's uploaded photos).

I did a test and tried to use the File Response as described in the docs: https://laravel.com/docs/9.x/responses#file-responses

This is how I did it: In web.php:

Route::get('show_image', [ImageController::class, 'show_image']);

In ImageController:

public function show_image(Request $request)
{
    $pathToFile = '../storage/uploads/460s6DLmCnvoom90S7wfk.jpg';
    return response()->file($pathToFile);
}

Now when I enter the URL of the route in the browser: http://mysite.dev/show_image it displays me the image in the browser inside an img tag with src=http://mysite.dev/show_image (Not a blade file or anything, I simply enter the URL in the browser and it does that automatically.

So far so good, but what I want is to fetch multiple images and have control over them, so not just go to the URL and see the image in full screen.

I need to fetch for example 20 images at once and replace the hard coded array I have of the following form:

const images = [
  {
    id: '1',
    src: 'https://image_api/path_to_some_image1'
  },
    id: '2',
    src: 'https://image_api/path_to_some_image2'
  },
   // more images paths
    id: '20',
    src: 'https://image_api/path_to_some_image20'
  }
];

But, the File Response does not return actual path like the hard coded above, it simply returns the entire image, So how can I actually do it? And not just for one, but an array of images?

I am using Fetch API to call the method above:

const getImagesPromise = fetch('get_images');
getImages
    .then((response) => {
                        
    })
    .then((data) => {

    });

Thanks!