开发者学堂课程【云存储 - 对象存储管理与安全：图片处理与静态网站托管】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/507/detail/6797
图片处理与静态网站托管
内容介绍：
一、云存储 OSS 图片处理
二、静态网站托管
三、图片处理演示
四、静态网站演示
本节介绍 OSS 上的针对不同类型的图片处理，可以对存在于云存储 OSS 中的图片进行相关处理。介绍 OSS 静态网站托管的功能，即可以模仿实现往常的静态网站。
一、云存储 OSS 图片处理
1、旋转
首先可以对图片进行旋转，通过访问图片地址的 URl 后按照一定格式做设定，就可以达到图片处理的效果。
http://lutest1.oss-cn-hangzhou.aliyuncs.com/image.jpg?x-oss-process=image/rotate,45
文件的访问 URL 分隔符 图片样式
此处在杭州的域中存储相应图片，图片名称为 image.jpg，？为图片处理的分隔符号，？后对 OSS 图片进行旋转 45° 的操作就得到上图效果。
2、剪切
按照刚才的图片处理格式，格式后的图片样式发生变化，首先进行剪切，然后设定剪切后的 x 轴 y 轴的高度与宽度以及沿中心的对齐方式
http://lutest1.oss-cn-qingdao.aliyuncs.com/image.jpg?x-oss-process=image/crop,x_100,y_200,w_200,h_200,g_center
3、水印
水印可以为文字水印，也可以为图片水印。此处为文字水印。
http://lutest1.oss-cn-qingdao.aliyuncs.com/image.jpg?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,size_100,text_SGVsbG8g5Zu-54mH5pyN5YqhlQ,color_FFFFFF,shadow_50,t_100,g_se,x_100,y_100
图片格式设置文字的大小、颜色、阴影等。
前面都为在 URL 后直接写上图片处理操作，例如设置高度宽度。但如果对于图像处理的操作非常复杂，例如 URL 非常复杂，并且包括了图片旋转和打水印等操作。此时可以通过设置样式 stylename 的方式进行设定。
进入到阿里云控制台中设定相应的样式。就会自动将原来长的字符串转换为stylename。后续在做同样的图片处理时只需要引用样式名称即可。
具体的用户使用场景：例如很多传统的应用中放图片时会有两个版本，一个为 PC端，一个为手机端，PC 端网络状况好所以需要精度大分辨率高的图片，但是手机端使用受限于屏幕和分辨率的大小。如果使用云存储 OSS 图片处理功能，OSS 中只需要存储一份即可满足 PC 和手机上不同应用的使用效果。
二、静态网站托管
1、用户可以通过 OSS 控制台–基础设置–静态页面将自己的 bucket 设置成静态网站托管模式
2、访问域名为: http://<自定义域名>/，如: http://cloudstorage.aliyunihao.net/
3、托管的静态网站支持如下功能︰
a)默认首页( Index Document Support )
b)默认 404 页( Error Document Support )
设置好后访问 OSS 域名时会自动转到相关的默认首页上，若访问资源不存在会转到 404 页面。
三、图片处理演示
打开控制台，进入 bucket 列表，选择一个 bucket 进入，点击文件管理，目前有几个图片文件。使用某一个图片文件进行示例。
点击该图片文件，点击复制文件 URL，使用浏览器打开，就可以显示图片。接着进行图片处理。先来旋转 45°，将字符串粘贴到 URL 后
?x-oss-process=image/rotate,45
以上就是图片旋转 45° 的效果。再来进行图片裁剪，在 URL 后粘贴字符串
?x-oss-process=image/crop,x_100,y_200,w_200,h_200,g_center。
以上为裁剪后效果，接着进行打水印，在 URL 后粘贴字符串
watermark,type_d3F5LXplbmhlaQ,size_100,text_SGVsbG8g5Zu-54mH5pyN5YqhlQ,color_FFFFFF,shadow_50,t_100.g_sex_100,y_100
以上为图片打水印效果。可以看出文字水印比较复杂，字符进行了转义，而且很长。一般情况下希望操作比较简便。
来查看 OSS 控制台，点击数据处理中的图片处理，此处可以看到有新建样式
点击创建样式，输入规格名称 ruletest，图像本身采用原图格式，选择文字水印，文字内容为 hello world 123，设置颜色 #79d562，选择文字字体方正黑体，设置水印位置居中，点击确定进行创建。生成了一段代码，由 ruletest 进行定义，拷贝定义的 stylename
?x-oss-process=style/ruletest
可以看到图片水印。
四、静态网站演示
回到控制台，在基础设置中有静态页面，目前还没有设置默认首页和默认 404 页，此时尝试直接输入 bucket 的域名
目前没有办法进行访问。现在来进行处理，进入到文件管理，上传 index.html 和404.html 文件，在静态页面中设置默认首页，设置默认首页为 index.html，点击保存。再进行访问，结果如图
如果此时随便输入一个不存在的文件，例如 abcd.html，实际上不存在，希望显示为一个固定样式 404 的页面，设置默认 404 页为 404.html，点击保存，此时再刷新结果如图
