PHP / XAMPP使用DirectoryIterator类不显示图像

Hi I am using a Wordpress custom theme, and in my footer I would like to display a series of random images chosen out of a folder. For now I have my path set correctly and my output of the path is correct. Then I insert the path in an <img> tag and it only displays broken image icons.

When I inspect, the image path is correct and the image names are there. However, when I click on the image link inside the inspect element box to view it I get an Access Denied! Error 403 on my tab where I am trying to display the image. I have done extensive research on this now and I have tried so many different approaches.

At one point I tried changing Xampp settings to allow all in httpd-vhosts.conf and httpd-xampp.conf. None of those worked. Then I started wondering if it could be a WordPress issue, but I am not sure how to figure that one out, despite all my research.

Here is a snippet of my code

$path = dirname(__DIR__, 2) . '/uploads/footer-img/';

//this outputs pathname of C:\xampp7\htdocs\project\wp-content/uploads/footer-img/

foreach ($dir as $fileinfo) {
    if ($fileinfo->isFile()) {

        echo $fileinfo->getBasename() . "
";
        echo $fileinfo->getBasename('.jpg') . "
";

        $r = $path . $fileinfo->getBasename();

        //this below outputs my directory with the image.jpg name

        echo $r;

        //this outputs broken image icons

        echo '<img src="' . $r . '"/>'; 

    }
}

You are mixing up local paths and web paths.

C:\xamp... is a local path. Anything that works with your filesystem can access it. Your browser can't.

http://localhost... is a web path, handled by your web server. This is the point of webserver. Browser can access it, things that works with filesystem can't.

To show images in your page you need to be producing web paths for them, according to your web server configuration.