DEV Community
·
Umbraco：为GetCropUrl()添加自定义查询字符串
内容提要
为了在Umbraco中使用Imgix处理图像，作者自定义了IImageUrlGenerator，添加了默认的fit=crop参数。通过复制并修改ImageSharpImageUrlGenerator类，作者将fit参数加入查询字符串，并在Umbraco的composer中注册了自定义生成器，完成了设置。
关键要点
-
作者需要在Umbraco中使用Imgix处理图像。
-
Umbraco v13的默认参数（如宽度和高度）工作良好，但裁剪模式不理想。
-
解决方案是自定义IImageUrlGenerator，添加默认的fit=crop参数。
-
通过复制并修改ImageSharpImageUrlGenerator类，作者将fit参数加入查询字符串。
-
在Umbraco的composer中注册自定义生成器，替换当前实现。
-
访问前端时，可以看到新的fit参数已成功添加。
延伸解读
自定义参数的必要性
在Umbraco中，默认的图像处理参数虽然能满足基本需求，但在裁剪模式上可能无法达到预期效果。通过自定义IImageUrlGenerator并添加fit=crop参数，可以有效提升图像展示的质量，尤其是在需要精确裁剪的场景中。
实现过程的简化
作者通过复制并修改现有的ImageSharpImageUrlGenerator类，避免了对每个图像调用的逐一修改。这种方法不仅节省了时间，还减少了出错的可能性，适合在已有项目中快速集成新功能。
注册自定义生成器的注意事项
在Umbraco的composer中注册自定义生成器时，需要确保替换的是正确的服务实现。错误的注册可能导致图像处理不符合预期，因此在实施前应仔细检查相关代码和依赖关系。
延伸问答
如何在Umbraco中使用Imgix处理图像？
通过自定义IImageUrlGenerator并添加fit=crop参数，可以在Umbraco中使用Imgix处理图像。
Umbraco v13的默认图像参数有哪些？
Umbraco v13的默认参数包括宽度和高度，这些参数工作良好，但裁剪模式不理想。
如何自定义Umbraco的图像URL生成器？
可以通过复制并修改ImageSharpImageUrlGenerator类，添加fit参数到查询字符串，来实现自定义图像URL生成器。
在Umbraco中如何注册自定义图像生成器？
在Umbraco的composer中注册自定义生成器，替换当前的IImageUrlGenerator实现。
添加fit=crop参数后，如何验证更改？
访问前端时，可以查看生成的图像URL，确认fit=crop参数已成功添加。
自定义IImageUrlGenerator的代码示例是什么？
自定义IImageUrlGenerator的代码示例包括添加fit参数到查询字符串的实现。
