如何使用 PHP 从 Azure Blob 存储中检索图像并在网站上显示

Question

I have an Azure Blob storage account and a folder with many images inside of it.我有一个 Azure Blob 存储帐户和一个包含许多图像的文件夹。 I would like for the images to be displayed on the website.我希望在网站上显示图像。 The path to the blob is https://example.blob.core.windows.net/example-media/facebook/ The first file below is index.php and the file below it is gallery.php . blob 的路径是https://example.blob.core.windows.net/example-media/facebook/下面的第一个文件是index.php ，下面的文件是gallery.php 。

The screenshot show how I wish the image would display I will be grateful for any help and/or recommendations.屏幕截图显示了我希望图像如何显示我将不胜感激任何帮助和/或建议。

<?php 

    $docRoot = $_SERVER['DOCUMENT_ROOT']; //Set document root
    require_once "$docRoot/includes/config.php"; //Get global config file
    require_once "$docRoot/includes/checklogin.php";
    require_once "$docRoot/includes/gallery.php";

    $path = "$docRoot" . "facebook/images";
    $uri = 'images';

    $page_name = "Facebook Image Gallery"; //Page name variable for use in title tag, etc.

    //
    // Let's reset the title to include the pagename, if it has one 
    // Shorthand PHP can be hard to read, this is an if (?), else(:)
    //
    $page_name != "" ? $site_title = $site_title." | ".$page_name : $site_title = $site_title;

?>

<!DOCTYPE html>
<html lang="en">

    <?php 
        $docRoot = $_SERVER['DOCUMENT_ROOT'];
        include "$docRoot/includes/header2.php";
    ?>        
    <div class="event-top">
        <h1>Facebook Image Gallery</h1>
        <p>Grab the list of thumbnail images to scroll, or click the forward/back arrow on the right/left of each image to navigate the gallery. Right-click and "Save Image as" to download.</p>
    </div>
    <div class="campaign-bottom container-fluid"> <!-- lower piece -->
        <div class="fotorama" data-auto="false"></div>
    </div>
    <div class="clearfix"></div>

    <script type="text/javascript">
            $(function() {

                var $window = $(window),
                    $body = $('body'),
                    pixelRatio = window.devicePixelRatio || 1,
                    width = Math.min(760 * pixelRatio, 1280),
                    ratio = 1.5,
                    thumbHeight = 56,
                    thumbWidth = thumbHeight * ratio;

                var data = <?= json_encode(galleryContent($path, $uri)) ?>;

                $('.fotorama').fotorama({
                    data: data,
                    clicktransition: 'dissolve',
                    width: '100%',
                    ratio: ratio,
                    hash: true,
                    maxheight: '100%',
                    nav: 'thumbs',
                    margin: 2,
                    shuffle: true,
                    thumbmargin: 2,
                    thumbwidth: thumbWidth,
                    thumbheight: thumbHeight,
                    allowfullscreen: 'native',
                    navposition: 'top',
                    keyboard: {
                        space: true
                    },
                    shadows: false,
                    fit: 'cover'
                });
                });
</script>

    <?php 
        $docRoot = $_SERVER['DOCUMENT_ROOT'];
        include "$docRoot/includes/footer2.php";
    ?>
    </body>
</html>

<?php

/*function isNullOrWhitespace($str)
{
    return ($str === null || (strlen(trim($str)) == 0)) ? TRUE : FALSE;
}*/

function galleryContent($path, $uri, $getFolders = false)
{
        $list = [];
        $parts = scandir($path);

        //Look for extension matches and push
        foreach ($parts as $name) {

            //Clean up path
            $fullPath = realpath($path . DIRECTORY_SEPARATOR . $name);
            $isDirectory = is_dir($fullPath);
            $match = null;

            if (($getFolders == $isDirectory) && ($isDirectory
                ? ($name[0] != '.')
                : (preg_match(GALLERY_REGEX, $name, $match) === 1)))

                $list[] = [
                    'name' => $name,
                    'path' => $fullPath,
                    //Convert similar extension to single representation (add double tiff?)
                    'type' => $isDirectory ? 'directory' : str_replace(['jpeg', 'tiff'], ['jpg', 'tif'], $match[2]),
                    'img' => $uri . '/' . $name,
                    //'shortname' => $isDirectory ? $name : $match[1],
                    /*'video' => (!$isDirectory && is_file(
                        realpath($path . DIRECTORY_SEPARATOR . $match[1] . '.' . GALLERY_VIDEO_TYPE)
                    )) ? ($uri . '/' . $match[1] . '.' . GALLERY_VIDEO_TYPE) : null*/
                    'video' => (!$isDirectory && is_file(
                        realpath($path . DIRECTORY_SEPARATOR . $match[1] . '.' . 'mp4')
                    )) ? ($uri . '/' . $match[1] . '.' . 'mp4') : null
                ];
        }

        return $list;
}

?>

Answer 1

You may use Microsoft Azure Storage PHP Client Libraries to access your Azure Storage service.您可以使用Microsoft Azure 存储 PHP 客户端库来访问您的 Azure 存储服务。

You can use the SDK to generate an URL with SAS of your image.您可以使用 SDK 生成带有SAS图像的 URL。 Then directly put the URL to <img src="the_url_with_SAS_of your_image"> , in this way, your image should be able to show on your page.然后直接把 URL 放到<img src="the_url_with_SAS_of your_image"> ，这样你的图片应该可以在你的页面上显示了。

Here is a sample for generating a link with SAS .这是生成与 SAS 链接的示例。

If you do not care about security, you can set your image blob to be public.如果您不关心安全性，可以将图像 blob 设置为公开。 In this way, you can directly access it without SAS.这样就可以不用SAS直接访问了。

如何使用 PHP 从 Azure Blob 存储中检索图像并在网站上显示

问题描述

1 个解决方案

解决方案1
2 2020-03-17 02:14:58

如何使用 PHP 从 Azure Blob 存储中检索图像并在网站上显示

问题描述

1 个解决方案

解决方案1 2 2020-03-17 02:14:58

解决方案1
2 2020-03-17 02:14:58