I have create-react-app application and I am unable to display the image. In a code I have
<img src="/files/2k28WHrMCJu9jSEEss0Y9sKV7Oqf4b/0/120" alt="" />
use .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]
it should transfer to
<img src="/files/files.php?url=2k28WHrMCJu9jSEEss0Y9sKV7Oqf4b/0/120" alt="" />
folder structure app is:
|- build
|- files
| |- files.php
|- public
| |- .htaccess
| |- api
| |- ...
|- src
| |- folders with all pages, components, ...
|- storage
| |- all images
PHP code (files.php) returns
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);
If I run the application in build mode (from the build directory), everything works perfectly. It doesn't work in a development environment. What is the reason that it works in build mode and not in development mode. Is the reason a directory structure or a proxy or something else?
The question is why it works in the build app and development does not.
If I use the direct URL to open the photo to the browser
http://buil-app/files/2k28WHrMCJu9jSEEss0Y9sKV7Oqf4b/0/120
in the build app, the photo will be displayed.
Using development mode
http://localhost:3000/files/2k28WHrMCJu9jSEEb7/O/120 show not photo but applications. Rewrite didn't work in .htaccess or didn't find a path?
