本文档介绍如何快速使用OSS图片处理服务。您可以通过三种方式处理图片:为图片URL添加参数进行单次处理,使用图片样式对不同图片进行相同处理,或使用OSS SDK对图片进行处理。

通过添加处理参数对图片进行处理

如果您需要对 OSS 中的图片进行单次处理,可以在图片的访问URL后添加相应的处理参数。

  1. 登录OSS管理控制台
  2. 在左侧的存储空间列表中,单击需要处理的图片文件所在的存储空间的名称。
  3. 在存储空间的概览页,单击文件管理页签,然后单击要处理的文件名称。
  4. 在文件的详情对话框中,单击打开文件 URL,图片会在浏览器中打开。
    说明
    • 经过图片样式处理的图片无法通过添加参数进行处理。因此在详情对话框中,请确保在图片样式中选择不使用图片样式
    • 请确保您对图片文件有写权限。有关文件权限的详情,请参见设置文件读写权限ACL
    • 对于图片文件(未修改文件http头的情况下):
      • 若您的 Bucket 是2019年9月23日前创建的,在浏览器中打开OSS默认访问域名或自有域名生成的文件URL时可以预览文件内容。
      • 若您的 Bucket 是2019年9月23日后创建的,在浏览器中打开OSS默认域名生成的文件URL时会以附件形式下载;使用自有域名生成的文件URL访问时,可以预览文件内容。
      • 因浏览器对于部分图片格式不支持预览,可能会出现直接下载的情况。对于此类问题,您只需要在浏览器上安装支持预览对应格式文件的插件即可。
  5. 在浏览器地址栏中,按照以下格式在图片的 URL 后添加相应的图片处理参数:https://bucket.<endpoint>/object?x-oss-process=image/action1,parame_value1/action2,parame_value2/...
    URL的说明如下:
    • http://bucket.<endpoint>/object:这部分即为原图片在浏览器地址栏中的 URL。
    • x-oss-process=image:这部分用于引导后续添加的图片处理参数。x-oss-process前使用半角问号(?)与原图片 URL 连接,image后使用正斜线(/)与图片处理参数连接。
    • action:对图片进行操作的参数名称。多个参数之间用正斜线(/)连接,操作按顺序执行。
    • parame:对图片进行操作的参数值。

    例如,用户要对位于杭州地域的存储空间bucket1内名为test.jpg的图片进行顺时针旋转90度并等比缩略50%的操作,则可以按照以下URL添加图片处理参数:https://bucket1.oss-cn-hangzhou.aliyuncs.com/test.jpg?x-oss-process=image/rotate,90/resize,p_50

    其中https://bucket1.oss-cn-hangzhou.aliyuncs.com/test.jpg为原图片文件的URL,rotateresize分别是图片旋转和图片缩略的操作名称,90p_50为参数的值。

    有关图片处理操作各参数的用法和说明,请参见下表中列出的文档。

    处理操作 说明 文档
    图片缩放 对图片进行等比缩放或固定宽高缩放。 图片缩放
    图片裁剪 使用内切圆裁剪图片。 内切圆
    通过指定范围的方式裁剪图片。 自定义裁剪
    将图片在x或y轴上等分为多个区域,然后取出指定区域。 索引切割
    使用圆角矩形裁剪图片。 圆角矩形
    图片旋转 设置是否对图片进行自动旋转 自适应方向
    对图片进行指定角度的顺时针旋转。 旋转
    图片效果 为图片添加模糊效果。 模糊效果
    调整图片的亮度。 亮度
    对图片进行锐化。 锐化
    调整图片的对比度。 对比度
    格式转换 将图片转换为指定的格式。 格式转换
    可以对保存为JPG或WebP格式的图片进行图片质量转换。 质量变换
    指定图片的呈现方式。 渐进显示
    获取图片信息 获取图片的平均色调。 获取图片主色调
    获取图片的宽度、长度、文件大小、格式、EXIF信息等。 获取信息
    图片水印 为图片添加图片、文字或混合水印。 图片水印
  6. 添加参数完成后,按回车键,浏览器中会显示处理后的图片文件。您可以复制带有参数的图片URL,将其分享给其他用户。也可以在浏览器中将处理后的图片下载至本地。

使用图片样式对图片进行处理

如果您需要对多张图片进行相同的操作,可以创建一个图片样式将这些操作封装起来,然后使用创建的样式对多张图片进行操作。

首先,按照以下步骤创建一个图片样式。

  1. 登录OSS管理控制台
  2. 在左侧的存储空间列表中,单击目标存储空间的名称。
  3. 在存储空间的概览页,单击图片处理页签,然后单击新建样式
  4. 新建样式对话框中,在基本编辑高级编辑页签中新建图片样式。
    • 基本编辑:使用图形化的方式新建图片样式。 输入规则名称,然后选择要对图片进行的处理。
    • 高级编辑:使用指定处理参数的方式新建图片样式。输入规则名称,然后在代码区域按照以下格式直接输入图片缩放的参数: image/action1,parame_value1/action2,parame_value2/...
      • action:对图片进行操作的参数名称。多个参数之间用正斜线(/)连接,操作按顺序执行。
      • parame:对图片进行操作的参数值。

      各操作对应的参数的用法和说明与通过添加处理参数对图片进行处理中相同。

  5. 配置完成后,在新建样式对话框中,单击确定
    说明 有关图片样式的详细设置和使用,请参见图片样式

创建图片样式后,就可以使用样式对多个图片进行相同的处理。

  1. 登录OSS管理控制台
  2. 在左侧的存储空间列表中,单击目标存储空间的名称。
  3. 在存储空间的概览页,单击文件管理页签,单击要处理的图片名称。
  4. 在图片的详情对话框中,从图片样式下拉列表中选择一个图片样式,在预览窗口中即可看到图片经过处理后的效果。您可以单击复制文件URL获取处理后图片的访问地址。

以下视频详细演示了图片样式处理操作:

使用OSS SDK对图片进行处理

除在控制台中按照上述两种方法对图片进行处理外,您还可以使用OSS SDK对图片进行处理。图片处理服务都是GET操作,所以要对图片进行处理,只需在调用GetObject接口时添加process参数即可。

以 Python SDK 为例,可以通过以下逻辑对图片进行缩略:

bucket = oss2.Bucket(oss2.Auth(access_key_id, access_key_secret), endpoint, bucket_name)
key = 'example.jpg'
new_pic = 'new-example.jpg'
process = "image/resize,m_fixed,w_100,h_100" //对图片进行强制缩略。
bucket.get_object_to_file(key, new_pic, process=process)

有关各个语言 SDK 中进行图片处理的用法和示例,请参见下表。

SDK 图片处理文档 使用示例
Java SDK 图片处理 ImageSample.java
Python SDK 图片处理 image.py
C# SDK 图片处理 ImageProcessSample.cs
PHP SDK 图片处理 Image.php
JS SDK 图片处理 object.test.js
C SDK 图片处理 oss_image_sample.c