Symfony / liip_imagine :图像路径解析结果为 404
Symfony / liip_imagine : image path resolution results in 404
服务器配置
Symfony 4.4.2
Apache 2.4.29
PHP: 7.3
Hosting: AWS LightSail
我使用 liip_imagine 包来处理上传的图像并使用 asset()
在 twig 模板中显示它们。不幸的是,图像 URL 解析为 404,我不知道为什么。
这是相关的树枝模板:
<div class="col">
<p>{{ 'Current image' | trans }}</p>
{% if module.image != '' %}
<img style="width: 180px;" src="{{ asset(module.image | imagine_filter('learningModuleImage')) }}" alt="">
{% endif %}
</div>
我检查了这个:
- 文件已正确上传到 /public/upload 文件夹中。
- module.image 确实包含图像哈希名称和扩展名:
da305b9a0fee3eb7bdc5bfc9b64e88ff.jpeg
- 真实的url:
/public/upload/da305b9a0fee3eb7bdc5bfc9b64e88ff.jpeg
生成url:https://domain.tld/media/cache/learningModuleImage/da305b9a0fee3eb7bdc5bfc9b64e88ff.jpeg
配置:
liip_imagine:
loaders:
default:
filesystem:
data_root:
- "%kernel.project_dir%/public/upload"
- "%kernel.project_dir%/public/assets/img"
resolvers:
default:
web_path:
web_root: "%kernel.project_dir%/public/upload"
cache_prefix: media/cache
filter_sets:
cache: ~
learningModuleImage:
filters:
downscale:
max: [512, 512]
profile:
filters:
downscale:
max: [512, 512]
# the name of the "filter set"
thumb:
# adjust the image quality to 75%
# quality: 75
# list of transformations to apply (the "filters")
filters:
# create a thumbnail: set size to 120x90 and use the "outbound" mode
# to crop the image when the size ratio of the input differs
thumbnail: { size: [128, 128], mode: outbound }
# create a 2px black border: center the thumbnail on a black background
# 4px larger to create a 2px border around the final image
# background: { size: [124, 94], position: center, color: '#000000' }
我还检查了虚拟主机:
<IfModule mod_ssl.c>
<VirtualHost *:443>
ServerName domain.tld
DocumentRoot /var/www/project/public
DirectoryIndex /index.php
<Directory /var/www/project/public>
AllowOverride All
Order Allow,Deny
Allow from All
Options -MultiViews
Require all granted
FallbackResource /index.php
</Directory>
ErrorLog ${APACHE_LOG_DIR}/error-project.log
CustomLog ${APACHE_LOG_DIR}/access-project.log combined
# Include /etc/letsencrypt/options-ssl-apache.conf
SSLCertificateFile /etc/letsencrypt/live/domain.tld/fullchain.pem
SSLCertificateKeyFile /etc/letsencrypt/live/domain.tld/privkey.pem
Include /etc/letsencrypt/options-ssl-apache.conf
</VirtualHost>
</IfModule>
我解决了!
这是工作配置。谢谢@MaulikParmar 的提示!
liip_imagine:
loaders:
default:
filesystem:
data_root:
- "%kernel.project_dir%/public/upload"
- "%kernel.project_dir%/public/assets/img"
resolvers:
default:
web_path:
web_root: "%kernel.project_dir%/public"
cache_prefix: media/cache
filter_sets:
cache: ~
learningModuleImage:
cache: default
filters:
downscale:
max: [512, 512]
profile:
filters:
downscale:
max: [512, 512]
# the name of the "filter set"
thumb:
# adjust the image quality to 75%
# quality: 75
cache: default
# list of transformations to apply (the "filters")
filters:
# create a thumbnail: set size to 120x90 and use the "outbound" mode
# to crop the image when the size ratio of the input differs
thumbnail: { size: [128, 128], mode: outbound }
# create a 2px black border: center the thumbnail on a black background
# 4px larger to create a 2px border around the final image
# background: { size: [124, 94], position: center, color: '#000000' }
服务器配置
Symfony 4.4.2
Apache 2.4.29
PHP: 7.3
Hosting: AWS LightSail
我使用 liip_imagine 包来处理上传的图像并使用 asset()
在 twig 模板中显示它们。不幸的是,图像 URL 解析为 404,我不知道为什么。
这是相关的树枝模板:
<div class="col">
<p>{{ 'Current image' | trans }}</p>
{% if module.image != '' %}
<img style="width: 180px;" src="{{ asset(module.image | imagine_filter('learningModuleImage')) }}" alt="">
{% endif %}
</div>
我检查了这个:
- 文件已正确上传到 /public/upload 文件夹中。
- module.image 确实包含图像哈希名称和扩展名:
da305b9a0fee3eb7bdc5bfc9b64e88ff.jpeg
- 真实的url:
/public/upload/da305b9a0fee3eb7bdc5bfc9b64e88ff.jpeg
生成url:
https://domain.tld/media/cache/learningModuleImage/da305b9a0fee3eb7bdc5bfc9b64e88ff.jpeg
配置:
liip_imagine:
loaders:
default:
filesystem:
data_root:
- "%kernel.project_dir%/public/upload"
- "%kernel.project_dir%/public/assets/img"
resolvers:
default:
web_path:
web_root: "%kernel.project_dir%/public/upload"
cache_prefix: media/cache
filter_sets:
cache: ~
learningModuleImage:
filters:
downscale:
max: [512, 512]
profile:
filters:
downscale:
max: [512, 512]
# the name of the "filter set"
thumb:
# adjust the image quality to 75%
# quality: 75
# list of transformations to apply (the "filters")
filters:
# create a thumbnail: set size to 120x90 and use the "outbound" mode
# to crop the image when the size ratio of the input differs
thumbnail: { size: [128, 128], mode: outbound }
# create a 2px black border: center the thumbnail on a black background
# 4px larger to create a 2px border around the final image
# background: { size: [124, 94], position: center, color: '#000000' }
我还检查了虚拟主机:
<IfModule mod_ssl.c>
<VirtualHost *:443>
ServerName domain.tld
DocumentRoot /var/www/project/public
DirectoryIndex /index.php
<Directory /var/www/project/public>
AllowOverride All
Order Allow,Deny
Allow from All
Options -MultiViews
Require all granted
FallbackResource /index.php
</Directory>
ErrorLog ${APACHE_LOG_DIR}/error-project.log
CustomLog ${APACHE_LOG_DIR}/access-project.log combined
# Include /etc/letsencrypt/options-ssl-apache.conf
SSLCertificateFile /etc/letsencrypt/live/domain.tld/fullchain.pem
SSLCertificateKeyFile /etc/letsencrypt/live/domain.tld/privkey.pem
Include /etc/letsencrypt/options-ssl-apache.conf
</VirtualHost>
</IfModule>
我解决了!
这是工作配置。谢谢@MaulikParmar 的提示!
liip_imagine:
loaders:
default:
filesystem:
data_root:
- "%kernel.project_dir%/public/upload"
- "%kernel.project_dir%/public/assets/img"
resolvers:
default:
web_path:
web_root: "%kernel.project_dir%/public"
cache_prefix: media/cache
filter_sets:
cache: ~
learningModuleImage:
cache: default
filters:
downscale:
max: [512, 512]
profile:
filters:
downscale:
max: [512, 512]
# the name of the "filter set"
thumb:
# adjust the image quality to 75%
# quality: 75
cache: default
# list of transformations to apply (the "filters")
filters:
# create a thumbnail: set size to 120x90 and use the "outbound" mode
# to crop the image when the size ratio of the input differs
thumbnail: { size: [128, 128], mode: outbound }
# create a 2px black border: center the thumbnail on a black background
# 4px larger to create a 2px border around the final image
# background: { size: [124, 94], position: center, color: '#000000' }