Laravel 使用 Cloudinary 缩放图像的模型中的自定义属性 URL

Question

在我的网络应用程序中，我使用 Cloudinary 进行图像存储。图片上传工作正常，但我想为图片创建一个自定义属性，所以当从数据库中取回图片 url 并修改宽度和高度时。

一张图片的link：https://res.cloudinary.com/wokong/image/upload/v1568570430/storyHeader/cxjir4g9tkaa8xepxodg.jpg

它存储在数据库中，但当它从数据库中获取时，它应该带有一些缩放比例，这样网站加载就不会花费太多时间。

这是我的故事模型：

class Story extends Model
{
    use Commentable, Searchable;
    /**
     * The attributes that are mass assignable.
     *
     * @var array
     */
    protected $fillable = [
        'title',
        'summary',
        'content',
        'created_at',
        'story_statuses_id',
        'image', 'language',
        'likes',
        'views',
        'url_key',
    ];



    /**
     * The attributes that should be cast to native types.
     *
     * @var array
     */
    protected $casts = [
        'is_public' => 'boolean',
    ];

我不明白怎么用谁能帮忙？

Answer 1

Cloudinary 支持运行时调整图像大小

根据他们的文档而不是这个

https://res.cloudinary.com/wokong/image/upload/v1568570430/storyHeader/cxjir4g9tkaa8xepxodg.jpg

使用

https://res.cloudinary.com/wokong/image/upload/w_100,h_100,c_fit/v1568570430/storyHeader/cxjir4g9tkaa8xepxodg.jpg

如您所见，我在 upload 之后添加了 /w_100,h_100,c_fit/ 以指示 Cloudinary 动态调整大小

w 是宽度，h 是高度，c 是裁剪时要使用的比例类型

您可以找到文档 here

更新 1

应该这样做

$default_url = "https://res.cloudinary.com/wokong/image/upload/v1568570430/storyHeader/cxjir4g9tkaa8xepxodg.jpg";

$width = 100;
$height = 100;

echo str_replace("/upload", "/upload/w_".$width.",h_".$height.",c_fit", $default_url);

更新 2

你的模型看起来像

class Story extends Model
{
    use Commentable, Searchable;
    /**
     * The attributes that are mass assignable.
     *
     * @var array
     */
    protected $fillable = [
        'title',
        'summary',
        'content',
        'created_at',
        'story_statuses_id',
        'image', 'language',
        'likes',
        'views',
        'url_key',
    ];



    /**
     * The attributes that should be cast to native types.
     *
     * @var array
     */
    protected $casts = [
        'is_public' => 'boolean',
    ];

    public function getImageForWebAttribute()
    {
        $width = 100; // You can keep this info in app config
        $height = 100;

        // Here i am assuming `image` is where you store Cloudinary url
        return str_replace("/upload", "/upload/w_".$width.",h_".$height.",c_fit", $this->image);
    }
}

你可以这样称呼它

$story->image_for_web

可以找到 laravel 自定义修改器的文档 here

Answer 2

您可以保存上传响应中返回的 public_id，而不是将上传的整个 URL 图像保存在您的数据库中。然后你可以使用 Cloudinary 的 SDK 为你生成转换 URLs，通过将所需的转换参数传递给 cloudinary_url() 辅助函数，以及图像的 public_id.

例如，假设您要生成图像的 URL，其 public_id 为 sample。此外，您希望根据客户端的设备和浏览器，以尽可能最佳的格式传送图像。您还想使用 Cloudinary 的自动质量算法并将图像缩小到 500 像素的宽度，同时保留其原始纵横比。您可以使用以下代码实现它：

$url = cloudinary_url('sample', array(
  'fetch_format' => 'auto',
  'quality' => 'auto',
  'crop' => 'scale',
  'width' => 500 
));

echo $url; 将打印以下内容：

http://res.cloudinary.com/<cloud_name>/image/upload/c_scale,f_auto,q_auto,w_500/sample

如果您希望使用 SDK 生成整个 <img> 标签，您可以使用 cl_image_tag() 作为 cloudinary_url() 的仅 URL 输出的替代方法。

这里是 Cloudinary 文档中相关部分的 link，其中包含更多有关如何同时使用 cl_image_tag() 和 cloudinary_url() 的示例。

Answer 3

好的，只是对...的额外帮助

例如，您将 $images 附加到 laravel 中控制器的视图您可以通过 url 动态生成固定宽度和高度并附加到 bootstrap 网格系统..

`

     <div class="col-6 col-md-4 col-lg-3">
            <a href="{{$image->image_url}}">                     
            @php
            $url = $image->image_url;
            @endphp
<img class="img img-fluid" src="{{ str_replace("/upload", "/upload/w_350,h_220,q_70,c_scale", $url) }}" alt="">
                </a>    

           

        </div>

`

您也可以通过控制器方法使用 Cloudder::show(Cloudder::getPublicId(), ["width" => $width, "height"=>$height])

Laravel 使用 Cloudinary 缩放图像的模型中的自定义属性 URL

Laravel custom attribute in Model for Scaling image using Cloudinary URL

php

laravel

cloudinary