问题描述
[viewBag]
==
<?PHP
function onStart()
{
// $this['src'] is a file object
// e.g. for uploaded files in public directory
if ($this['src'] instanceof \System\Models\File) {
$this['width'] = $this['src']->getWidthAttribute();
$this['public_path'] = $this['src']->path;
}
// $this['src'] is a string
else {
$this['public_path'] = \System\Classes\MediaLibrary::url($this['src']);
// Relative path provided
if (!file_exists($this['src'])) {
$this['local_path'] = base_path() . Config::get('cms.storage.media.path') . '/' . $this['src'];
}
// Full path provided
else {
$this['local_path'] = $this['src'];
}
// Get width of original image
$file = new \October\Rain\Database\Attach\File;
$file->fromFile($this['local_path']);
$this['width'] = $file->getWidthAttribute();
$this['image_from'] = 'media';
}
if (isset($this['max_width']) && $this['max_width'] < $this['width']) {
$this['width'] = $this['max_width'];
}
}
?>
==
<img
class="{{ class }}"
src="{% if width <= 1600 %}{{src}}{% else %}{{ public_path|resize(1600,1600) }}{% endif %}"
srcset="
{% if width >= 500 %}{{ public_path|resize(500,500) }} 500w {% endif %}
{% if width >= 768 %},{{ public_path|resize(768,768) }} 768w {% endif %}
{% if width >= 1200 %},{{ public_path|resize(1200,1200) }} 1200w {% endif %}
{% if width >= 1600 %},{{ public_path|resize(1600,1600) }} 1600w {% endif %}
{% if width >= 2000 %},{{ public_path|resize(2000,2000) }} 2000w {% endif %}
{% if width >= 2500 %},{{ public_path|resize(2500,2500) }} 2500w {% endif %}
{% if width >= 3000 %},{{ public_path }} 3000w {% endif %}"
sizes="
{% if width >= 500 %}(max-width: 500px) 500px{% endif %}
{% if width >= 768 %},(max-width: 768px) 768px{% endif %}
{% if width >= 1200 %},(max-width: 1200px) 1200px{% endif %}
{% if width >= 1600 %},(max-width: 1600px) 1600px{% endif %}
{% if width >= 2000 %},(max-width: 2000px) 2000px{% endif %}
{% if width >= 2500 %},(max-width: 2500px) 2500px{% endif %}
{% if width >= 3000 %},3000px{% endif %}"
alt="{{ alt }}"
>
然后我像这样在我的 Twig 中使用它:
{% partial 'responsive-image' src='hotel/pool.jpg' class='jarallax-img' alt='background image' %}
这成功地创建了缩略图,但是在我的 storage/app/uploads/public
目录中查看时,它似乎在每次请求时复制全尺寸图像,然后将它们保存到那里的随机子目录中。不幸的是,这会很快耗尽驱动器上的可用硬盘空间。
解决方法
复制图像的部分是这样的:
// Get width of original image
$file = new \October\Rain\Database\Attach\File;
$file->fromFile($this['local_path']);
$this['width'] = $file->getWidthAttribute();
这就是为什么每次请求时它都会创建原始图像的新副本。
好在PHP内置了获取图片宽度的函数,所以你甚至不需要使用OctoberCMS来获取宽度:
$this['width'] = getimagesize($this['local_path'])[0];