最新更新日期:Dec-18-2023
或您的用户上传图像资产到云形后,您可以通过动态URL提供这些资产动态URL中包含指令,告诉云形使用一组变换参数变换资产云中自动实现所有变换,变换资产在快速CDN向终端用户传递最优用户经验前自动优化
举例说,您可调整大小并裁剪,添加叠加图像,模糊或像素面孔,应用各种特效和滤镜并应用设置优化图像并按需交付图像
Cloudinary PHP库简化变换URL生成,便于资产嵌入PHP应用
并见:PHP视频转换
语法概述
PHPSDK为变换资产提供更直觉编码经验
- SDK支持基于动作语法,设计使建楼交付URL和变换更逻辑化和可发现性
- 编译归定交付URL时,每个动作表示不同变换组件.
- 允许从开发环境内发现可用选项,并确保只支持选项可并用
- 动作组:a
动作组
表示对云形指令如何变换资产的具体方面(例如效果学
,调整
或调整大小
) - 动作:
动作
定义特定动作应用Effect::outline()
,Adjust::replaceColor()
或重裁大小::crop
) - 定性词:
定性词
进一步定义如何应用Action容留性
条件化Adjust::replaceColor
动作容值输入颜色替换17
)某些动作还配有必修饰语,并随后作为动作方法的一部分提供(例如,Adjust::replaceColor(Color::GREEN)
指定颜色应用)
输出动作
完全变换元件如果有多重动作,则每个变换构件都通过URL裁剪分离例例上语法示例生成URL类似
交付变换图像
可使用生成图像标签或直接URL构建指令交付图像
图像塔格法
可使用云形图像添加到 PHP视图图像塔格
帮助者方法方法生成全图像资源URL基于给定变换参数并添加图像标签到 HTML代码
上方代码生成以下HTML图像标签
请求中也可以包括动作,例如提供图像加宽400像素
调整大小
上例中)
链式变换动作
云化支持强变换连多重变换动作并发作为单变换请求的一部分,例如调整图像大小并添加边框在某些情况下,您可能想对上一个变换动作结果执行额外变换要做到这一点,可使用链式变换动作
下示例优先裁剪原图像到一组自定义坐标并变换结果以填充130x100矩形
下例应用4链化变换:自定义裁剪300x200,填到130x100,旋转20度后缩放50%
更多图像变换信息见应用常用图像变换.
直接URL构建
上头图像塔格
上文描述方法生成HTML图像标签在某些条件中,你可能想直接生成变换URL,不包含图像标签只返回URL使用图像显示
helper方法调用tourl()
方法论以下是几个例子:
tourl()
方法中还选择将图像法投入字符串
(string)$cld->image()
或将方法置入字符串
"{$cld->image()}"
应用常用图像变换
本节概述并举例说明下列常用图像变换特征,并链接到这些特征的更详细的文档
记住本节仅意在向您介绍使用图像转换PHP基础知识
综合解释如何实现各种变换见图像变换.完整列表支持图像变换及其用法见变换URLAPI引用.
裁剪裁剪
变大小和/或裁剪图像有多种方法,并控制在裁剪期间保存的图像区
下例使用填充
裁剪法生成并提供完全填充请求200x200大小并保留原端比图像使用面部检测重力确保图像中所有面部保留并居中
也可以使用自动重力自动判定什么保留在裁剪中
细节重构和裁剪选项见大小裁剪图像.
转换为另一种图像格式
可基本以图像格式向云形传送图像三种主要方式转换并交付另一种格式:
- 指定图像公有标识并配有期望扩展
- 使用
fack_format
参数化 - 使用
汽车
fack_format指令云式为每个浏览器请求最优化格式提供图像
例举 :
- gif格式提供.jpg文件
- letCloudinary为每个浏览器选择最优格式举个例子,在 Chrome中,此图像可交付.avi或.web格式(取决于产品环境搭建):
上方代码生成 URL
f_aut
参数 :
更多细节见:
更多细节见图片格式支持.
应用图像特效和滤镜
从大选择图像特效、增强和滤镜中选择应用到图像可用效果包括各种色平衡级效果、色调、模糊性效果、像素化效果、锐化效果、自动改进效果、艺术滤波、图像和文本叠加效果、变形效果、轮廓、背景、阴影等
下方代码应用卡通效果、圆角效果和背景色效果
关于可用图像特效和滤镜详解见可视图像特效和增强
添加文本图像叠加
可添加图像和文本为主图像叠加覆盖图像上可应用与所有图像相同的变换类型,并使用重力设置或x和y坐标控制重叠位置也可以对文本应用各种变换,如颜色、字体、大小、旋转等
举例说 下方代码覆盖一对情侣照片迭代照片使用面部检测调整色饱和度并应用维格特效果裁剪词爱添加成粉红色花式字体并旋转适配设计并添加气球图形外加最后图像裁剪和角角四舍五入
图像优化
默认时云式自动执行所有变换图像的某些优化还有一些附加特性使您能够进一步优化应用中使用的图像其中包括优化图像质量、格式和大小等
举个例子,你可以使用汽车
值对fack_format
并质量问题
属性自动交付格式和质量图像,在满足质量水平要求的同时最小化文件大小下方应用这两个参数,结果产生351KBAVIF文件(Chrome),而不是1.4MBJPG质量无可见变化
深入审查多方法优化图像,见图像优化
响应图像设置
响应式网络设计是一种设计网站向用户提供最优浏览经验的方法,而不论设备、视图大小、定向或分辨率如何查看它保证最优经验意味着避免发送高分辨率图像以调整客户端规模,并给小显示器用户带来显著带宽浪费取而代之的是,你应总是为每个设备提供右尺寸图像和屏幕尺寸
举个例子,你可确保每个用户接收图像大小和设备像素比汽车
值对dpr
并宽度
属性。上头汽车
值代之以客户端基于屏幕属性和视图港宽度的实际值
云化提供几种选项简化响应图像传递复杂性详细指南如何实施这些选项见响应图像.