简介
本文档提供关于合成动图接口的相关的 API 概览以及 SDK 示例代码。
注意:
COS 小程序 SDK 版本需要大于等于 v1.5.0。
API | 操作描述 |
将多张 jpg 或 png 格式的图片合成为一个 GIF 动图 |
上传时使用合成动图
下面示例展示了如何在上传图片时实现合成动图。
图片上传完成后,COS 会存储原始图片和已完成合成动图的图片。后续用户可以通过普通的下载请求获取处理结果。
示例代码
<view><button type="primary" bindtap="button">上传时使用合成动图</button></view>
Page({button: function () {const config = {// 需要替换成您自己的存储桶信息Bucket: 'examplebucket-1250000000', /* 存储桶,必须 */Region: 'COS_REGION', /* 存储桶所在地域,必须字段 */};wx.chooseMessageFile({count: 2,type: 'all',success: function (res) {var file = res.tempFiles[0];wxfs.readFile({filePath: file.path,success: function (res) {cos.putObject({Bucket: config.Bucket, // Bucket 格式:test-1250000000Region: config.Region,Key: file.name,Body: res.data,Headers: {'Pic-Operations':'{"is_pic_info": 1, "rules": [{"fileid": "exampleobject", "rule": "imageMogr2/animate/duration/10/images/<imageurl1>"}]}',},},requestCallback,);},fail: (err) => console.error(err),});},fail: (err) => console.error(err),});},});
对云上数据进行合成动图
下面示例展示了如何在对已存储在 COS 的图片进行相应处理操作,并将结果存入到 COS。
示例代码
<view><button type="primary" bindtap="button">对云上数据进行合成动图</button></view>
Page({button: function () {// sdk的引入及初始化cos请参考 https://cloud.tencent.com/document/product/436/31953const config = {// 需要替换成您自己的存储桶信息Bucket: 'examplebucket-1250000000', /* 存储桶,必须 */Region: 'COS_REGION', /* 存储桶所在地域,必须字段 */};cos.request({Bucket: config.Bucket,Region: config.Region,Key: '1.jpeg',Method: 'POST',Action: 'image_process',Headers: {'Pic-Operations':'{"is_pic_info": 1, "rules": [{"fileid": "exampleobject", "rule": "imageMogr2/animate/duration/10/images/<imageurl1>"}]}',},},requestCallback,);},});
下载时使用合成动图
下面示例展示了如何在下载图片时实现合成动图。
示例代码
<view><button type="primary" bindtap="button">下载时使用合成动图</button></view>
Page({button: function () {// sdk的引入及初始化cos请参考 https://cloud.tencent.com/document/product/436/31953const config = {// 需要替换成您自己的存储桶信息Bucket: 'examplebucket-1250000000', /* 存储桶,必须 */Region: 'COS_REGION', /* 存储桶所在地域,必须字段 */};cos.getObject({Bucket: config.Bucket,Region: config.Region,Key: '1.png',QueryString: `imageMogr2/animate/duration/10/images/<imageurl1>`,},requestCallback,);},});