fullAvatarEditor富头像上传编辑器文档

前端之家收集整理的这篇文章主要介绍了fullAvatarEditor富头像上传编辑器文档前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

《fullAvatarEditor富头像上传编辑器文档》要点:
本文介绍了fullAvatarEditor富头像上传编辑器文档,希望对您有用。如果有疑问,可以联系我们。

这个富头像上传编辑器文档是网上找的,有点乱,放着备用。官网关闭了,将就着用吧。


fullAvatarEditor调用方法

new fullAvatarEditor(swfContainerID,[height],[width],flashvars,[callback]);

返回值:object,该对象可调用call方法,请参见 call方法

swfContainerID

  • 用以包裹Flash的HTML元素的ID。

height

  • Flash的高度,默认为 600。

width

  • Flash的宽度,默认为 630。

flashvars 配置参数

名称类型默认值描述
idStringfullAvatarEditor接收消息的swf的ID,用以区分同一页面如果存在多个组件。
upload_urlStringnull上传图片的接口。该接口需返回一个json字符串,且会原样输出到callback 回调函数 的参数对象的属性content中,请参见 上传接口的返回数据。
qualityNumber100生成的头像图片的质量,取值范围1-100,数值越大生成图片越清晰,相对地文件也会越大。
isShowUploadResultIconv2.0Booleantrue上传完成时(无论成功和失败),是否显示表示上传结果的图标。


callback 回调函数

  • 执行该函数时,函数中的this关键字指向表示swf的HTMLObjectElement,并且会给函数传递一个表示事件消息的json对象作为参数。

  • json对象的属性如下:

  • code : Number主要用来辨识消息的具体来源和内容,以便客户端知道如何处理。

  • type : Number0 表示成功,1 表示警告,2 表示错误,3 表示异常。

  • content : *表示消息的内容。可能的值:

codetypecontent描述
10
页面成功加载组件后触发的事件消息。
2
  • 0

  • 2


  • 加载图片成功时触发的事件消息。

  • 加载图片失败时触发的事件消息。

3
  • 0

  • 1

  • 2


  • 摄像头已准备就绪且用户已允许使用。

  • 摄像头已准备就绪但用户未允许使用!

  • 摄像头被占用!

42选择的原图片文件大小,带单位。如:8.88MB选择的原图片文件大小超出了指定的值。
5
  • 0

  • 1

  • 2

  • 3

call 方法,这些方法自定义外界元素(如tab、button)时很有用。

  • object.call(methodName[,methodParameter]);

methodName:String调用的flash内的方法名称
methodParameter:String传递到该方法的参数。
调用方法枚举表

methodNamemethodParameter功能描述
changePanelupload 或 webcam切换到本地上传图片选择面板或摄像头拍照面板。
loadPic要加载的图片的url。加载网络图片
pressShutter
执行拍照操作。
srcUploadtrue|false设置是否上传图片
upload
执行上传保存的操作。

发送至上传接口的数据

发送方式:post

原图file域:Field Name:__source
File Name:如果是本地和网络图片为原始文件名(不含扩展名)、如果是摄像头拍照则为 *FromWebcam

头像file域:Field Name:__avatar1,__avatar2,__avatar3,... 即 __avatar + 1至头像总数。
File Name:同上。

其他文本域:Field Name:__initParams(String)加载指定url的原图时将该参数追加到url中,可保证视图跟保存头像时一致。可用于修改头像,帮助提升用户体验。注意:上传原图时才会发送该数据。

上传接口的返回数据

接口至少必须返回一个包含名为“success”、值为true(表示上传成功)或false(表示上传失败)的json字符串,且会原样输出到 callback 回调函数 的参数对象的属性content中。 
例:当上传成功或失败时可分别返回以下json对象。


{

    "success" : true,//该名/值对是必须定义的,表示上传成功

    "sourceUrl" : "原图片位于服务器的虚拟路径",

    "avatarUrls": ["头像图片位于服务器的虚拟路径",..]

}

{

    "success" : false,//该名/值对是必须定义的,表示上传失败

    "msg" : "上传的原图文件大小超出限值了!"

}

在进行调用时即可如下使用获取返回的数据



var swf = new fullAvatarEditor('swf',{

    id: 'swf',

    upload_url: '/upload.PHP'

},function(json){

    if (json.code == 5)

    {

        switch(json.type)

        {

            //表示图片上传成功。

            case 0:

                alert('原图片位于服务器的虚拟路径为'+json.content.sourceUrl);

                alert('头像图片位于服务器的虚拟路径为'+json.content.avatarUrls.join(','));

            break;

            case 1:

                alert('头像上传失败,原因:' + json.content.msg);//will output:头像上传失败,原因:上传的原图文件大小超出限值了!

            break;

            case 2:

                alert('头像上传失败,原因:指定的上传地址不存在或有问题!');

            break;

            case 3:

                alert('头像上传失败,原因:发生了安全性错误!请联系站长添加crossdomain.xml到网站根目录。');

            break;

        }

}

});


猜你在找的JavaScript相关文章