美图秀秀api开发文档

admin管理员组

文章数量:1532753

2024年1月6日发(作者：)

API说明

美图秀秀开放插件包含美图秀秀M1（完整版）、美图秀秀M2（美化图片）、及美图秀秀M3（拼图），我们已经对三个版本进行整合，提供一致的接口供您调用。

1、环境配置

1.1、设置

下载文件，把解压出来的文件放在您保存图片或图片来源的服务器根目录下，

比如： ，那么的路径为：/。

需要注意的是必须部署于站点根目录下才有效， 的目前是授权来自美图域下的flash向您的站点上传图片或者从您的站点加载图片。

【备注】由于本地测试会被flash安全沙箱拦住，请自行搭建web服务器，在web 环境中测试。

1.2、调用方法

1.2.1、引用JS代码

在你的网页代码head标签里或者body标签里加入代码。

1.2.2、初始化xiuxiu

xiuxiu是所有API的顶级命名空间，API的调用书写形式均为：(arg1,arg2,...)调用API时，为保证flash初始化完成，请务必使用以下语法来调用API：

= function ()

{

// your code here

}

2、API列表

2.1、方法

2.1.1、 加载SWF（WF）

功能描述：网页中嵌入美图秀秀的编辑器

语法：

WF(container,editorType,width,height,id);

参数

contain必选

是

字段类型

string

说明

嵌套flash的容器

er

editorType

width

height

否

否

否

int

string

string

编辑器类型（1为轻量编辑，2为轻量拼图，3为完整版，默认值1）

编辑器宽度（可以为数字或者百分比，对轻量编辑和完整版有效）

编辑器高度（可以为数字或者百分比，对轻量编辑和完整版有效）

编辑器在页面中的id，默认值为” xiuxiuEditor”（当需要在同一个页面内嵌入一个以上编辑器

时需要以不同的id来区分，这时候就很有用，在接下去的几个接口中便可通过不同的id调用不

id

示例代码

WF("altContent", 3, 800, "100%","lite");

2.1.2、 加载图片（oto）

功能描述：编辑器载入图片

语法：

oto(images,base64,id);

参数 必选 字段类型 说明

在编辑器中载入图片，类型可以为字符串或数组，也就是说可以同时载入一张到多张图片

（需要注意的是，1.如果是数组，数组中元素必须是同一类型图片，要么都是base64

类型的，要么是url；2.如果是base64图片，需要去掉几个头string或者images

base64

id

示例代码

单张图片：

oto("/sources/images/");

单张base64的图片：

oto("/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja…", true);

多张图片：

oto(["/sources/images/"]);

多张base64的图片：

oto(["/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja…"], true);

是

否

否

array

boolean

string

字符，只保留纯图片数据，

例如去掉” data:image/jpeg;base64,”）

是否是base64图片，默认值为false

编辑器在页面中的id，默认值为” xiuxiuEditor”

否

string

同编辑器的接口）

2.1.3、上传URL（oadURL）

功能描述：设置上传接口地址，接收图片的地址

语法：

oadURL (url,id);

参数

url

必选

是

字段类型

string

说明

设置上传接口地址（必须为绝对路径）

编辑器在页面中的id，默认值为”

id

示例代码

oadURL("/image_"); //修改为您自己的上传接收图片程序

2.1.4、设置参数（oadArgs）

功能描述：设置上传参数（如无需上传参数可不调用）

语法：

oadArgs (args,id);

参数

args

必选

是

字段类型

object

说明

设置上传参数

编辑器在页面中的id，默认值为”

id

示例代码

oadArgs({a:1, b:"lucky"});

2.1.5、设置上传类型（oadType）

功能描述：设置上传方式（以下流式和表单上传都是POST请求方式）

语法：

oadType (uploadType,id);

必参数 选 字段类型 说明

设置上传方式

1、流式上传

Content-type:application/octet-stream；

2、标准表单上传

Content-type:multipart/form-data；

默认上传方式为流式上传，只有上传方式为表单上传才需调用此函数

关于octet-stream上传方式的接收代码可参阅否

string

xiuxiuEditor”

否

string

xiuxiuEditor”

/php-input

关于multipart/form-data 上传方式的接收代码可参阅/php/php_file_

php示例可参考 流式上传 或者 标准表单上传；

uploadType

是

int

C#示例可参考 流式上传 或者 标准表单上传；

JSP示例可参考 流式上传 或者 标准表单上传。

id

示例代码

否

string

编辑器在页面中的id，默认值为” xiuxiuEditor”

oadType(2);

备注：美图秀秀提供两个上传接口供测试

一个是octet-stream方式上传，地址为：/

另一个是multipart/form-data方式上传，地址为：/image_

表单名称为””upload_file”。

2.1.6、设置表单名称（oadDataFieldName）

功能描述：设置在上载 POST 操作中位于文件数据之前的字段名

也就是对应于设置html中的name

语法：

oadDataFieldName (uploadDataFieldName,id);

参数

uploadDataFieldName

id

示例代码

oadDataFieldName("Filedata");

2.1.7、高级参数设置（nchVars）

功能描述（高级功能）：设置flash初始化参数来实现更多高级功能，请在WF之前调用此函数，否则无法生效。

语法：

nchVars (key, value);

参数

key

必选

是

字段类型

string

String

value

示例代码

nchVars (“scrollTrap”, 1);

下表为可设置的属性列表

字段类参数 型

可能的值 说明

是否开启鼠标捕获，0为不开启，1为开启。当鼠标滚轮在flash上滚scrollTrap int

0或1

动时是否禁用页面中的滚动。

自动导航到某个功能块，例如完整版需要导航到照片拼接，可以

xiuxiu. setLaunchVars (“nav”, “puzzle/puzzlePhoto”);有关此参数完整设置，请参阅

nav string

nav详细参数设置。

是

/Boolean/Number

参数值

说明

参数名

是

否

string

string

必选 字段类型 说明

仅对表单上传有效（如果使用表单上传且字段名不为"Filedata"才需调用此函数）

编辑器在页面中的id，默认值为” xiuxiuEditor”

localFileEnabled

2.2、事件

2.2.1、初始化（）

= function(id) {}

当编辑器初始化完成时调用，必须定义一个在调用事件处理函数时执行的函数。

参数

id

示例代码

= function (id)

{

// your code here

alert(“flash初始化完成”);

说明

调度此事件的编辑器在页面中的id

string

0或1 是否支持打开本地文件（目前只对轻量编辑器有效）

}

2.2.2、图片上传前（reUpload）

reUpload = function(data, id) {}

在图片上传前调用，提供上传前最后一个机会来改变上传数据甚至终止上传，如果需要终止上传，只要返回false，需要继续上传则返回true；同时data参数为object类型，包含要上传的图片的属性，如宽度、高度、文件名、字节数等。

参数

data：要上传的图片的属性（object类型，下表为data包含的属性）

属性

width

height

type

size

name

numOperate

isNet

url

参数

id：调度此事件的编辑器在页面中的id

适用场景：

1.论坛上传图片最大为2M，因此可在上传前检查图片大小，超过则进行提示不再上传；

示例代码

字段类型

int

int

string

int

string

int

booleam

string

说明

图片宽度

图片高度

格式（目前只有jpg、png、gif）三种

图片字节数

图片名称

打开编辑器之后编辑的第几张图片

是否是网络图片

如果是网络图片，则为图片url，否则为空

reUpload = function (data, id)

{

var size = data. size;

if(size > 2 * 1024 * 1024)

{

alert(“图片不能超过2M”);

return false;

}

return true;

}

2.图片上传前重新更新上传参数

示例代码

oadArgs({c:1, d:"test" }, id);

reUpload = function (data, id)

{

oadArgs({c:1111, d:"goodluck" }, id);

return true;

}

2.2.3、上传响应（adResponse）

adResponse= function(data,id) {}

当上传图片后端响应时调用，必须定义一个在调用事件处理函数时执行的函数。

参数

data：服务器端返回的数据

id：调度此事件的编辑器在页面中的id

示例代码

adResponse = function (data)

{

alert("上传响应" + data);

}

2.2.4、关闭编辑器（e）

e = function(id) {}

当在flash中点击关闭按钮时调用，必须定义一个在调用事件处理函数时执行的函数。

参数

id：调度此事件的编辑器在页面中的id

示例代码

e = function (id)

{

alert("编辑器关闭");

}

2.2.5、调试编辑器（g）

g= function(data,id) {}

当发生错误时输出的调试信息，必须定义一个在调用事件处理函数时执行的函数。

参数

data：调试信息

id：调度此事件的编辑器在页面中的id

示例代码

g = function (data)

{

alert("错误响应" + data);

}

错误代码及其意义

错误代码

MT0001

描述

上传接口不存在(404)

您的服务器没有，

或者MT0002

MT0003

内未含有

domain="*."/>

上传接口未设置

本文标签： 上传图片调用编辑器