oss 图片处理

图片处理介绍:

图片处理文章链接

使用:

原始图片上传到OSS后,可以通过简单的RESTful接口,在任何时间、任何地点、任何互联网设备上对图片进行处理。

接口正常上传图片 返回oss图片之后 再对图片进行处理)

>>>接口上传oss照片

1.获取oss相关参数

/api/admin/vendor/uploadToken?path=images/


接口返回的oss信息


2.上传图片file到oss

http://zhuoyou-shop-test.oss-cn-hangzhou.aliyuncs.com/


图片信息上传至oss

3.拼接图片地址:

图片地址 =  host(接口1返回的)+dir(接口1返回的)+file.name

eg:......

https://zhuoyou-shop-test.oss-cn-hangzhou.aliyuncs.com/images/4.jpg



>>>>>> 图片处理 使用方式有好几种:

>匿名访问(通过添加处理参数对图片进行处理)

通过如下格式的三级域名匿名访问处理后的图片:

http://.......?x-oss-process=image/<yourAction>,<yourParamValue>

>授权访问 eg:

let OSS =require('ali-oss');

let client =new OSS({accessKeyId:'',accessKeySecret:'',bucket:'',endpoint:''});

let signUrl = client.signatureUrl('example.jpg', {expires:600,'process':'image/resize,w_300'});

过期时间10分钟, 图片处理式样"image/resize,w_300"

>SDK访问 eg:

let OSS =require('ali-oss');

.......

 缩放 client.signatureUrl('example.jpg', {expires:3600,process:'image/resize,m_fixed,w_100,h_100'}) 


图片处理功能也很多: 

获取图片信息图片格式转换图片缩放图片裁剪图片旋转图片效果图片水印自定义图片处理样式级联处理



图片操作详细信息

以下都用的是第一种方式 匿名访问方式处理图片:http://.......?x-oss-process=image/xx,xx

有各个图片操作指南地址

指南地址

1.图片水印介绍

介绍地址

水印参数:watermark

t可选参数,指定水印的透明度。

g可选参数,指定水印在图片中的位置,[nw,north,ne,west,center,east,sw,south,se]

x可选参数,指定水印的水平边距, 即距离图片边缘的水平距离。水印位置是左上、左中、左下、右上、右中、右下

y可选参数,指定水印的垂直边距,即距离图片边缘的垂直距离, 水印位置是左上、中上、右上、左下、中下、右下

voffset可选参数,指定水印的中线垂直偏移。水印位置在左中、中部、右中时,可以指定水印位置根据中线往上或者往下偏移

水印位置

图片水印参数:image

文字水印参数:

text必选参数,指定文字水印的文字内容。参数值为文字内容进行Base64编码后的字符串。

(文字水印内容必须是通过以下方法进行Base64编码后的字符串  最大长度为64个字符(即支持汉字最多20个左右)。)

type可选参数,指定文字水印的文字类型。

默认值:wqy-zenhei( 编码后的值:d3F5LXplbmhlaQ)

color可选参数,指定文字水印的文字颜色。默认值:000000(黑色)

size可选参数,指定文字水印的文字大小(单位为px)。(0,1000]

shadow可选参数,指定文字水印的阴影透明度。[0,100]

rotate可选参数,指定文字顺时针旋转角度。[0,360]

fill可选参数,指定是否将水印铺满原图。0、1

1:表示将水印铺满原图。

0:表示不将水印铺满全图。



~水印图片目前仅支持PNG、JPGWebP格式。

加水印图片后缀示例eg:

?x-oss-process=image/watermark,rotate_30,fill_1,size_20,color_B0C4DE,shadow_50,t_100,g_center,text_SGVsbG8g5Zu-54mH5pyN5YqhIQ

rotate_30:旋转角度

fill:水印是铺满 还是单独一个水印

size:水印文字大小;

color:水印文字颜色

shadow:水印文字阴影

t:水印透明度

g:水印位置

text:水印文字 文字要转换为base64格式

测试图片地址:

https://zhuoyou-shop-test.oss-cn-hangzhou.aliyuncs.com/images/affair.jpg?x-oss-process=image/watermark,rotate_30,fill_1,size_20,color_B0C4DE,shadow_50,t_100,g_center,text_SGVsbG8g5Zu-54mH5pyN5YqhIQ


加水印的图片



2.压缩图片介绍

介绍地址

https://help.aliyun.com/document_detail/44705.html?spm=a2c4g.11186623.6.1665.58002e93foKl5K

参数quality

q决定图片的相对质量,对原图按照q%进行质量压缩。例如,如果原图质量为100%,添加quality,q_90参数会得到质量为90%的图片。如果原图质量为80%,添加quality,q_90参数会得到质量72%的图片。

只有为JPG格式的原图添加该参数,才可以决定图片的相对质量。如果原图为WebP格式,添加该参数相当于指定了原图绝对质量,即与参数Q的作用相同。

Q决定图片的绝对质量,将原图质量压缩至Q%,如果原图质量小于指定参数值,则按照原图质量重新进行压缩。

例如,如果原图质量是95%,添加quality,Q_90参数会得到质量90%的图片。如果原图质量是80%,添加quality,Q_90只能得到质量80%的图片。

 该参数只能对保存格式为JPG、WebP的图片使用,对其他格式的图片无效果。 如果同时指定了q和Q,会按照Q的值进行处理。

eg:

?x-oss-process=image/quality,q_80

quality,q_80表示把图片压缩至80%


》在质量变换时不指定Q或者q参数,可能会导致图片占用空间变大。

》由于 仅支持有损压缩的图片格式:JPG和WebP  不支持png   所以要先将图片转换为jpg格式 在压缩 因为压缩只能是jpg格式


图片格式转换

介绍地址:

https://help.aliyun.com/document_detail/44703.html?spm=a2c4g.11186623.6.1663.53c1e849R2jCmX

参数:format

jpg将原图保存成 jpg 格式,如果原图是 png、webp、bmp 存在透明通道,默认会把透明填充成白色。

png将原图保存成 png 格式。

webp将原图保存成 webp 格式。

bmp将原图保存成 bmp 格式。

gif将 gif 格式保存成 gif 格式,非 gif 格式是按原图格式保存。

tiff将原图保存成 tiff 格式。


(将图片转换成对应格式,包括 jpg、png、bmp、webp、gif、tiff。 不填格式,则默认按原图格式返回。

对于普通缩略请求, 建议 format 参数放到处理参数串最后,例如:image/resize,w_100/format,jpg。

对于缩略+水印的请求,建议 format 参数跟缩略参数放在一起,例如:image/reisze,w_100/format,jpg/watermark,...。

保存成 jpg 格式时,默认是保存成标准型的 jpg (Baseline JPEG), 如果想指定是渐进式 JPEG (Progressive JPEG), 可以指定参数 interlace,)


eg:

?x-oss-process=image/format,jpg

表示将图片格式转换为jpg图片

所以压缩图片最终的后缀

?x-oss-process=image/format,jpg/quality,q_80

比如:https://zhuoyou-shop-test.oss-cn-hangzhou.aliyuncs.com/images/v2-1665b647c52900b714f2f402fdea0262_r.jpg?x-oss-process=image/format,jpg/quality,q_70


压缩前32.7 KB


压缩后12.6 KB



数据操作 不仅可以操作图片 还可以操作视频

介绍地址:

https://help.aliyun.com/document_detail/99372.html?spm=a2c4g.11186623.6.1644.2ce22e935lduWO

video视频截帧

https://help.aliyun.com/document_detail/64555.html?spm=a2c4g.11186623.2.17.120251b0x3pgs4#concept-kz1-cwc-wdb

操作分类:video

操作名称:snapshot


t指定截图时间。[0,视频时长]  单位:ms

w指定截图宽度,如果指定为0,则自动计算。[0,视频宽度]  单位:像素(px)

h指定截图高度,如果指定为0,则自动计算;如果w和h都为0,则输出为原视频宽高。[0,视频高度]  单位:像素(px)

m指定截图模式,不指定则为默认模式,根据时间精确截图。如果指定为fast,则截取该时间点之前的最近的一个关键帧。比如:fast

f指定输出图片的格式。比如:jpg、png

ar指定是否根据视频信息自动旋转图片。如果指定为auto,则会在截图生成之后根据视频旋转信息进行自动旋转。比如:auto


eg:

使用fast模式截取视频7s处的内容,输出为JPG格式的图片,宽度为800,高度为600。

?x-oss-process=video/snapshot,t_7000,f_jpg,w_800,h_600,m_fast

使用精确时间模式截取视频50s处的内容,输出为JPG格式的图片,宽度为800,高度为600。

?x-oss-process=video/snapshot,t_50000,f_jpg,w_800,h_600

比如:http://hr-culture.oss-cn-hangzhou.aliyuncs.com/videos/4.mp4?x-oss-process=video/snapshot,t_2000,f_jpg,m_fast

视频截图 第2s



最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,919评论 6 502
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,567评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 163,316评论 0 353
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,294评论 1 292
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,318评论 6 390
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,245评论 1 299
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,120评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,964评论 0 275
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,376评论 1 313
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,592评论 2 333
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,764评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,460评论 5 344
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,070评论 3 327
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,697评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,846评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,819评论 2 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,665评论 2 354