imgix/imgix-php

imgix-php 是一个用于生成 imgix 图片 URL 的 PHP 客户端库。

4.1.0 2023-01-31 05:20 UTC

This package is auto-updated.

Last update: 2024-08-29 03:31:26 UTC


README

imgix logo

imgix-php 是一个用于生成 imgix 图片 URL 的客户端库,它在 PHP 版本 8.08.18.2 下进行了测试。

Version Build Status Downloads License FOSSA Status

安装

您可以通过 composer 安装此包

composer require imgix/imgix-php

使用方法

要开始以编程方式创建 imgix URL,请将 php 文件添加到您的项目中。URL 构建器可以重复使用以生成任何在它所提供的域上的图片的 URL。

use Imgix\UrlBuilder;

$builder = new UrlBuilder("demos.imgix.net");
$params = array("w" => 100, "h" => 100);
echo $builder->createURL("bridge.png", $params);
// 'https://demos.imgix.net/bridge.png?h=100&w=100'

默认支持 HTTPS。但是,如果您需要 HTTP 支持,请在构建器上调用 setUseHttps

use Imgix\UrlBuilder;

$builder = new UrlBuilder("demos.imgix.net");
$builder->setUseHttps(false);
$params = array("w" => 100, "h" => 100);
echo $builder->createURL("bridge.png", $params);
// 'http://demos.imgix.net/bridge.png?h=100&w=100'

签名 URL

要生成签名 URL,您必须在源上启用安全 URL,然后将您的签名密钥提供给 URL 构建器。

use Imgix\UrlBuilder;

$builder = new UrlBuilder("demos.imgix.net");
$builder->setSignKey("test1234");
$params = array("w" => 100, "h" => 100);
echo $builder->createURL("bridge.png", $params);
// 'http://demos.imgix.net/bridge.png?h=100&w=100&s=bb8f3a2ab832e35997456823272103a4'

Srcset 生成

imgix-php 包允许通过 createSrcSet 方法生成自定义 srcset 属性。默认情况下,生成的 srcset 将允许通过构建图像宽度映射列表来切换响应式大小。

$builder = new UrlBuilder("demos.imgix.net", true, "my-key", false);
echo $builder->createSrcSet("image.png");

这将生成以下 srcset 属性值,然后可以将其提供给客户端

https://demos.imgix.net/image.png?w=100&s=e415797545a77a9d2842dedcfe539c9a 100w,
https://demos.imgix.net/image.png?w=116&s=b2da46f5c23ef13d5da30f0a4545f33f 116w,
https://demos.imgix.net/image.png?w=135&s=b61422dead929f893c04b8ff839bb088 135w,
                                        ...
https://demos.imgix.net/image.png?w=7401&s=ad671301ed4663c3ce6e84cb646acb96 7401w,
https://demos.imgix.net/image.png?w=8192&s=a0fed46e2bbcc70ded13dc629aee5398 8192w

固定宽度图片

在提供了足够关于图片尺寸信息的情况下,createSrcSet 将构建一个 srcset,允许以不同分辨率提供图片。在确定图片是否为固定宽度时考虑的参数是 wh

通过向 createSrcSet 提供宽度 高度,将为固定宽度图片生成不同的 srcset。

$builder = new UrlBuilder("demos.imgix.net", true, "my-key", false);
echo $builder->createSrcSet("image.png", array("h"=>800, "ar"=>"3:2", "fit"=>"crop"));

将生成以下属性值

https://demos.imgix.net/image.png?ar=3%3A2&dpr=1&fit=crop&h=800&s=6cf5c443d1eb98bc3d96ea569fcef088 1x,
https://demos.imgix.net/image.png?ar=3%3A2&dpr=2&fit=crop&h=800&s=d60a61a5f34545922bd8dff4e53a0555 2x,
https://demos.imgix.net/image.png?ar=3%3A2&dpr=3&fit=crop&h=800&s=590f96aa426f8589eb7e449ebbeb66e7 3x,
https://demos.imgix.net/image.png?ar=3%3A2&dpr=4&fit=crop&h=800&s=c89c2fd3148957647e86cfc32ba20517 4x,
https://demos.imgix.net/image.png?ar=3%3A2&dpr=5&fit=crop&h=800&s=3d73af69d78d49eef0f81b4b5d718a2c 5x

为了更好地理解 srcset,我们强烈建议您阅读 Eric Portis 的 "Srcset and sizes" 文章,该文章深入探讨了该主题。

可变质量

此库将在生成 固定宽度图片 srcset 时自动附加一个可变的 q 参数,该参数映射到每个 dpr 参数。这种技术通常用于补偿高-DPR 图片的文件大小增加。

由于高-DPR 图片在设备上以更高的像素密度显示,因此可以通过降低图像质量来减小整体文件大小,而不会牺牲感知的视觉质量。有关更多信息及该技术实施的示例,请参阅 此博客文章

此行为将尊重任何作为参数传递的覆盖 q 值。此外,您可以通过将 $disableVariableQuality = true 传递给 createSrcSet()$options 来完全禁用此行为。

此行为特别发生在渲染 固定宽度图片 时,例如

// Note that `params=array("w" => 100)` allows `createSrcSet` to _infer_ the creation
// of a DPR based srcset attribute for fixed-width images.
$builder = new UrlBuilder("demos.imgix.net", true, "", false);
$params = array("w" => 100);
$srcset = $builder->createSrcSet($path="image.jpg", $params=$params);

上述代码将生成以下 qdpr 查询 params 的 srcset

https://demos.imgix.net/image.jpg?dpr=1&q=75&w=100 1x,
https://demos.imgix.net/image.jpg?dpr=2&q=50&w=100 2x,
https://demos.imgix.net/image.jpg?dpr=3&q=35&w=100 3x,
https://demos.imgix.net/image.jpg?dpr=4&q=23&w=100 4x,
https://demos.imgix.net/image.jpg?dpr=5&q=20&w=100 5x'

流体宽度图片

自定义宽度

在生成 srcset 对时需要特定宽度的情况下,用户可以通过在 $options 数组中传递一个正整数数组来指定它们,作为 'widths'

$builder = new UrlBuilder("demos.imgix.net", true, "", false);
$opts = array('widths' => array(144, 240, 320, 446, 640));
$srcset = $builder->createSrcSet($path="image.jpg", $params=array(), $options=$opts);
https://demos.imgix.net/image.jpg?w=144 144w,
https://demos.imgix.net/image.jpg?w=240 240w,
https://demos.imgix.net/image.jpg?w=320 320w,
https://demos.imgix.net/image.jpg?w=446 446w,
https://demos.imgix.net/image.jpg?w=640 640w

注意:在将 srcset 作为固定宽度 srcset 渲染的情况下,传入的任何自定义 widths 都将被忽略。

此外,如果向 createSrcSet 方法传递了 widths 和宽度 tolerance,则自定义宽度列表将优先。

宽度范围

在某些情况下,您可能想限制由 createSrcSet 方法生成的非固定 srcset 的最小或最大值。为此,您可以指定 srcset 应该开始和停止的宽度。

$builder = new UrlBuilder("demo.imgix.net", true, "", false);
$opts = array('start' => 500, 'stop' => 2000);
$srcset = $builder->createSrcSet($path="image.jpg", $params=array(), $options=$opts);

上述 srcset 属性的格式化版本

https://demo.imgix.net/image.jpg?w=500 500w,
https://demo.imgix.net/image.jpg?w=580 580w,
https://demo.imgix.net/image.jpg?w=673 673w,
https://demo.imgix.net/image.jpg?w=780 780w,
https://demo.imgix.net/image.jpg?w=905 905w,
https://demo.imgix.net/image.jpg?w=1050 1050w,
https://demo.imgix.net/image.jpg?w=1218 1218w,
https://demo.imgix.net/image.jpg?w=1413 1413w,
https://demo.imgix.net/image.jpg?w=1639 1639w,
https://demo.imgix.net/image.jpg?w=1901 1901w,
https://demo.imgix.net/image.jpg?w=2000 2000w

宽度容差

srcset 宽度 tolerance 决定了图像下载大小与其渲染大小之间最大可容忍的差异。

例如,将此值设置为 10 表示图像不会比其原始尺寸大或小超过 10%。在实际操作中,为基于宽度的 srcset 属性生成的图像 URL 将以两倍此速率增长。

较低的容忍度意味着图像将更接近其原始尺寸渲染(从而提高感知图像质量),但将生成较大的 srcset 列表,并且用户可能在使用您网站上预渲染图像的缓存命中率方面体验到较低的速率。

默认情况下,srcset 宽度 tolerance 设置为 8%,我们认为这是在不牺牲视觉质量的同时最大化缓存命中的理想速率。用户可以通过提供正标量值作为宽度 tolerance 来指定自己的宽度容忍度。

$builder = new UrlBuilder("demo.imgix.net", true, "", false);
$opts = array('start' => 100, 'stop' => 384, 'tol' => 0.20);
$srcset = $builder->createSrcSet($path="image.jpg", $params=array(), $options=$opts);

在这种情况下,宽度 tolerance 设置为 20%,这将反映在 srcset 对的后续宽度之间的差异中。

https://demo.imgix.net/image.jpg?w=100 100w,
https://demo.imgix.net/image.jpg?w=140 140w,
https://demo.imgix.net/image.jpg?w=196 196w,
https://demo.imgix.net/image.jpg?w=274 274w,
https://demo.imgix.net/image.jpg?w=384 384w

ixlib 参数

出于安全和诊断目的,我们对所有请求使用生成 URL 所使用的库的语言和版本进行签名。

可以通过将 setIncludeLibraryParam 设置为 False 来禁用此功能,如下所示:

$builder = new UrlBuilder("demo.imgix.net", true, "", false);
// Or by calling `setIncludeLibraryParam`
$builder->setIncludeLibraryParam(false);

许可证

FOSSA Status