1

我有 create-react-app 应用程序,但无法显示图像。在我的代码中

<img src="/files/2k28WHrMCJu9jSEEss0Y9sKV7Oqf4b/0/120" alt="" />

使用 .htaccess

SetEnvIf Authorization .+ HTTP_AUTHORIZATION=$0
Options +FollowSymLinks -MultiViews

RewriteEngine On
RewriteBase /

RewriteRule ^files/(.*)$ /files/files.php?url=$1 [L,QSA]

RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d

RewriteRule ^ index.html [QSA,L]

它应该转移到

<img src="/files/files.php?url=2k28WHrMCJu9jSEEss0Y9sKV7Oqf4b/0/120" alt="" />

文件夹结构应用程序是:

|- build
|- files
|    |- files.php 
|- public
|    |- .htaccess
|    |- api
|    |- ...
|- src
|    |- folders with all pages, components, ...
|- storage
|    |- all images

PHP 代码 (files.php) 返回

header('Last-Modified: '. gmdate('D, d M Y H:i:s', time()) .' GMT');
header("Cache-Control: must-revalidate");
header('Expires:'. gmdate('D, d M Y H:i:s', time() + $expiry) .' GMT');
header('ETag: '. $etag);

header("Content-Type: image/jpeg");
header("Content-Length: ". filesize($file));
readfile($file);

如果我在构建模式下(从构建目录)运行应用程序,一切都会完美运行。它在开发环境中不起作用。它在构建模式下而不是在开发模式下工作的原因是什么。原因是目录结构还是代理或其他原因?

问题是为什么它在构建应用程序中有效而开发却没有。如果我在构建应用程序中使用直接 URL 将照片打开到浏览器 http://buil-app/files/2k28WHrMCJu9jSEEss0Y9sKV7Oqf4b/0/120 ,则会显示照片。使用开发模式 http://localhost:3000/files/2k28WHrMCJu9jSEEb7/O/120显示的不是照片而是应用程序。重写在 .htaccess 中不起作用或找不到路径?

在此处输入图像描述

4

1 回答 1

0

在您的反应应用程序中,将图像放在下面public/static/images并像这样处理它们:

<img src="/static/test.jpg" alt="test" />

于 2021-12-21T14:58:10.080 回答