图片处理

更新时间: 2023-03-31 16:09:37

oss

手动配置

35

教程简介

在本教程中,您将学习如何使用OSS存储一张原始图片,然后通过图片处理参数为图片添加水印、旋转图片、更改样式。您可以通过OSS的图片处理参数,在任何时间、任何地点、任何互联网设备上对存储在OSS上的图片进行处理,从而在不改变原图的情况下,应对各式各样图片需求。

教程通过OSS图片处理功能添加水印的图片示例如下:

demo-pic-2

我能学到什么

  • 学会如何使用OSS存储文件。

  • 学会如何使用OSS的图片处理功能对图片进行添加水印、旋转图片、更改格式等不同操作。

操作难度

所需时间

35分钟

使用的阿里云产品

对象存储OSS

所需费用

0元

准备环境和资源

5

开始教程前,请按以下步骤准备环境和资源:

  1. 访问阿里云免费试用。单击页面右上方的登录/注册按钮,并根据页面提示完成账号登录(已有阿里云账号)、账号注册(尚无阿里云账号)或实名认证(根据试用产品要求完成个人实名认证或企业实名认证)。

  2. 成功登录后,在产品类别下选择存储,在对象存储OSS卡片上单击立即试用

  3. 对象存储OSS面板,选中服务协议,然后单击立即试用

创建Bucket

5

  1. 登录对象存储OSS控制台

  2. 如果您没有开通过OSS服务,系统会提示您开通OSS服务,请按照页面提示开通OSS服务。

  3. 在左侧导航栏,选择Bucket列表

  4. Bucket列表页面,单击创建Bucket

  5. 创建Bucket面板,设置Bucket名称,设置地域华东1(杭州),其他保留默认设置,然后单击确定。设置的Bucket名称必须全局唯一,否则无法创建Bucket。本教程以华东1(杭州)地域为例。

上传文件

5

  1. 下载示例图片。OSS图片处理对于原图格式和大小有限制。如果您需要使用非本教程提供的示例图片,请确保您的图片满足条件。关于OSS原图的格式和大小限制,请参见使用限制

  2. 在左侧导航栏,选择文件管理>文件列表

  3. 文件列表页面,单击上传文件

  4. 上传文件页面,单击扫描文件

  5. 在弹出的对话框,选择下载的示例图片,然后单击打开

  6. 上传文件页面,单击上传文件任务列表面板显示上传成功

创建图片样式

5

  1. 在左侧导航栏,选择数据处理>图片处理

  2. 创建添加水印的图片样式style-1

    1. 图片处理页面,单击新建样式

    2. 新建样式面板,选择高级编辑页签,设置规则名称style-1,在代码框中输入图片处理参数代码用于为图片添加文字水印,然后单击确定

      image/watermark,text_ZGVtbw,type_ZmFuZ3poZW5nc2h1c29uZw,color_f7f2f2,size_40,rotate_64,fill_1,t_67,x_10,y_10
      image
  3. 重复以上步骤创建旋转图片的图片样式style-2和改变格式的图片样式style-3

    • 图片样式style-2的图片处理参数代码。

      image/rotate,78
    • 图片样式style-3的图片处理参数代码。

      image/format,jpg

获取图片URL

5

  1. 进入文件管理>文件列表页面,在上传的图片的右侧操作列,选择more>设置读写权限

  2. 设置读写权限面板,设置读写权限公共读,然后单击确定

  3. 如果弹出手机验证对话框,输入手机验证码,按照提示完成验证。

  4. 文件列表页面,单击上传的文件。

  5. 详情面板,单击复制文件URL

完成

5

  1. 按照<文件URL>?x-oss-process=style/<图片样式>的格式为复制的URL添加图片处理参数。

    • 添加了图片样式style-1的文件URL示例。

      https://examplebucket.oss-cn-hangzhou.aliyuncs.com/demo-pic.png?x-oss-process=style/style-1
    • 添加了图片样式style-2的文件URL示例。

      https://examplebucket.oss-cn-hangzhou.aliyuncs.com/demo-pic.png?x-oss-process=style/style-2
    • 添加了图片样式style-3的文件URL示例。

      https://examplebucket.oss-cn-hangzhou.aliyuncs.com/demo-pic.png?x-oss-process=style/style-3
  2. 在本地浏览器的地址栏中分别输入添加了图片处理参数的URL并访问。返回的图片会被默认下载。

    • 添加水印后的示例图片。

      demo-pic-2
    • 旋转后的示例图片。

      2
    • 转换格式后的示例图片。

      p572760

清理及后续

5

清理

完成教程后,请及时清理测试数据和试用资源。

OSS提供3个月的免费资源包,包含每月20 GB的标准(LRS)存储、每月2 GB的下行流量、每月20万次的请求数。完成教程后,请参考以下场景处理OSS资源:

  • 如果无需继续使用OSS Bucket,您可以登录对象存储OSS控制台,在文件列表页面,找到视频课程文件,然后在文件右侧操作列,选择more>彻底删除,根据界面提示删除文件。然后在左侧导航栏,选择删除Bucket,在删除Bucket页面,单击删除Bucket,然后根据界面提示删除Bucket。

  • 如果需继续使用OSS Bucket,请务必至少在资源包试用到期1小时前为您的阿里云账号充值或购买新的资源包。欠费后如果在延期免停权益额度内,您的服务将不会受到停服影响。欠费后如果超出了延期免停权益额度,OSS服务将自动停止。如果您在OSS停服后15天内未补足欠款,将视为您主动放弃OSS存储服务,阿里云将终止本产品服务条款并停止为您继续提供服务,您保存在阿里云的全部数据将会被清理删除,清理后数据不可恢复。

后续

在试用有效期期间,您还可根据希望测试的其它业务场景继续使用OSS Bucket。

总结

常用知识点

问题1:可以创建2个名称完全相同的Bucket吗?(单选题)

  • 可以

  • 不可以

正确答案是不可以。设置的Bucket名称必须全局唯一,因此您不可以创建2个名称完全相同的Bucket。

问题2:OSS的图片处理功能会改变原图片吗?(单选题)

  • 不会

正确答案是不会。OSS的图片处理是在原图片的URL上添加图片处理参数,不会改变原图片。

延伸阅读

阿里云首页 相关技术圈