You need to enable JavaScript to run this app.
导航

自定义处理样式

最近更新时间2023.12.26 14:59:01

首次发布时间2023.07.26 15:43:48

为了您便捷的使用历史版本图片处理能力,请您在开启自定义处理样式开关后,在样式管理自定义添加您需要实现的功能参数配置。历史版本图片处理包含 A 版和 Q 版两个类型,各版本支持配置的参数及参数配置规则请参考 A 版用法说明Q 版用法说明

前提条件

操作步骤

新建样式

  1. 登录 veImageX 控制台,进入服务管理页面。

  2. 选择要配置的服务,单击基础配置按钮。

  3. 高级配置页签选择自定义处理样式,打开功能开关后,单击样式管理按钮。

  4. 单击新建样式按钮,在弹出的新建样式配置框中参考下表完成配置。

    配置项说明
    样式名称可用于备注当前样式所在版本以及包含的图片处理能力。最多不超过 256 个字符,支持填写数字、大小写字母、下划线、短横线、小数点。

    代码

    参考旧版用法说明填写具体的图片参数配置,您可在右侧预览框查看参数配置是否生效以及具体配置效果。
    例如,设置 A 版等比缩放,指定图片的高为 100px 的图片处理样式,样式名称为 A_Test,参数配置为image/resize,h_100。此时访问该处理图的格式为:https://域名/存储URI?x-tos-process=style/A_Test。具体访问实现可参考示例说明

  5. 单击确定按钮,保存当前配置。

访问设置

  1. 自定义处理样式-样式配置页面,单击访问设置按钮。

  2. 在弹出的访问设置配置框中参考下表完成配置。

    配置项说明

    原图保护

    开启原图保护后,将无法通过源文件 URL 直接访问原图,以阻止恶意用户对该存储服务下原图的请求。开启后,可以使用携带样式参数/分隔符的请求访问处理后的图片(无需使用鉴权)。
    例如,您可以通过以下方式访问开启原图保护的处理后图片:

    • 使用携带样式参数的文件 URL 访问,格式为 https://域名/存储URI?x-tos-process=style/stylename
    • 使用携带分隔符(以@为例)的文件 URL 访问,格式为 https://域名/存储URI@stylename

    注意

    • 携带鉴权参数的源文件 URL 也无法直接访问开启了原图保护的原图。
    • 由于开启原图保护后,将作用于整个服务。所以强烈建议您对开启原图保护的服务仅存储需要保护原图的文件,其他文件使用其他服务存储。

    自定义分隔符

    为了进一步简化图片处理 URL,veImageX 支持自定义分隔符,配置后您可使用分隔符代替?x-tos-process=style/
    支持设置分隔符有分隔符为:~ @ $ ^ & * ( ) - _ / ! + = { } [ ] | : ; " ' , < >
    例如,分隔符设置为@,则图片处理访问 URL 为http(s)//:域名/存储URI@stylename

    注意

    一旦添加分隔符则无法删除,请谨慎操作。

管理样式

具体操作及说明如下表所示。

操作说明

单个删除

  • 选择一个待删除的样式,单击操作删除按钮完成删除操作。
  • 勾选一个待删除样式的确认框,单击上方操作栏的删除按钮完成删除操作。
批量删除勾选多个待删除样式的确认框,单击上方操作栏的删除按钮完成删除操作。

修改样式

选择一个待修改的样式,单击操作编辑按钮,在编辑样式框更新参数配置。

说明

样式名称,即 stylename,不支持修改。

导入导出样式

您可以导出源服务中已创建的样式,并将样式导入到目标服务,便于在目标服务中快速应用样式来处理图片文件。

  1. 在源服务中导出样式

    1. 在源服务管理页面,选择自定义样式处理 > 样式管理
    2. 样式配置页面,勾选待导出的样式后,单击上方操作栏的导出样式按钮。
    3. 您的自定义样式将自动保存至本地,样式文件名称默认为 export.imagey
  2. 在目标服务导入样式

    1. 在目标服务管理页面,选择自定义样式处理 > 样式管理
    2. 样式配置页面,单击导入样式
    3. 在弹出的对话框选择已导出的样式文件,然后单击打开
    4. 样式导入完成后,即可在目标服务中使用这些样式处理图片文件。

示例说明

最终处理图访问 URL:https://imagexdemo.volcimagextest.com/tos-cn-i-i4o5y3y840/imagexdemo.jpeg@A_Test