在 Symfony API 中显示上传到 public 目录之外的图像

Displaying an image uploaded outside of the public directory in a Symfony API

我正在使用 Symfony 作为 API 和 React 前端,分为两个独立的项目。 我将用户上传的图像存储在 Symfony 项目根目录的 medias/ 文件夹中,因为有些图像是机密的(这是一个商业应用程序),所以不能简单地将它们放在 public/ 文件夹中。

上传部分很好,但我无法弄清楚如何在 React 应用程序中显示文件,即使我使用 VichUploader 的 [=15= 从 API 中获得了完整的 link ] 如所述 in the API-Platform documentation.

我明白为什么它不起作用,因为它给了我类似 www.domain.com/medias/images/123.png 的东西,而 medias/ 文件夹位于 public/ 目录之外。

我不知道如何显示这些文件。我发现的每一个文档(Symfony、Vich...)、指南和论坛帖子都是关于在 Twig 或 Symfony 项目中的 webpacked javascript 中显示这些图像,而我的 javascript 是在另一个不同的项目中。

任何人都可以指导我在哪里寻找解决方案吗?

作为参考,这是我的VichUploader的配置文件:

vich_uploader:
    db_driver: orm

    mappings:
        machine_image:
            uri_prefix: /medias/images/machine
            upload_destination: '%kernel.project_dir%/medias/images/machine'
            namer: Vich\UploaderBundle\Naming\OrignameNamer

您必须创建一个控制器方法来从文件系统获取图像并使用该图像创建响应。

在该方法中,您还可以添加一些检查是否允许用户查看图像,但这取决于您的情况。在某些情况下,图像 url 不是 'guessable' 并且 可能 足够安全。

像这样:

use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\HttpFoundation\ResponseHeaderBag;
use Symfony\Component\Routing\Annotation\Route;

final class ImageController extends Controller
{
    #[Route(path: 'image/{img}', name: 'image', methods: ['GET'])]
    public function image(string $img) : Response
    {
        // .. add some security checks here

        $filepath = $this->storage->resolveUri($img);

        $response = new Response(file_get_contents($filepath));

        $disposition = $response->headers->makeDisposition(ResponseHeaderBag::DISPOSITION_INLINE, $img);

        $response->headers->set('Content-Disposition', $disposition);
        $response->headers->set('Content-Type', 'image/png');

        return $response;
    }
}

(未测试,如有问题欢迎提问)

虽然我不太喜欢“有一个 library/app/bundle 答案”- 答案,但如果您想添加一些其他功能,我想推荐 LiipImagineBundle。您可以创建缩略图、添加水印、添加 webp 支持等。