ayupload是一个极度纯净的上传插件，通过简单调整就可以融入到任何项目，支持多文件上传、上传速率动态控制、真实进度监控kb/s、分块生成MD5、分块上传、MD5校验秒传、暂停、取消等。
体验地址：https://www.threecss.com/AyUploadCliet/
项目目录结构：AyUploadCliet（1000行代码）|--js（js库）|--ayupload（ayupload文件夹）|--css（ayupload css）|--dist（ayupload js打包版本）|--images（ayupload image）|--src（ayupload js未打包版本）|--FileCofig.js（配置）|--lib（依赖js）|--jquery.mi.js######################################|--juggle-all.js（解耦合的工具库ALL IN ONE：https://github.com/diabaer/juggle）或|--juggle-help.js|--juggle-evet.js|--juggle-juggler.js （解耦合的工具库small require：https://github.com/diabaer/juggle）|--juggle-http.js|--juggle-mv.js######################################|--spark-md5.js（用于分块计算md5）|--idex.html（示例启动项目）AyUploadServer（899行代码）|--src（服务器代码）|--CommoCofig.java（配置）|--protobuf（消息包生成工具）AyUploadCliet怎么使用：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title></title> <!--juggle库 all i oe--> <!-- <script src="js/lib/juggle-all.js" type="text/javascript"></script> --> <!--juggle库 small require--> <script src="js/lib/juggle-help.js" type="text/javascript"></script> <script src="js/lib/juggle-evet.js" type="text/javascript"></script> <script src="js/lib/juggle-juggler.js" type="text/javascript"></script> <script src="js/lib/juggle-http.js" type="text/javascript"></script> <script src="js/lib/juggle-mv.js" type="text/javascript"></script> <!--分块生成md5--> <script src="js/lib/spark-md5.js" type="text/javascript"></script> <script src="js/lib/jquery.mi.js" type="text/javascript"></script> <lik href='js/ayupload/css/ayupload.css' rel='stylesheet' type='text/css'/> <!--ayupload库--> <script src="js/ayupload/dist/ayupload.js" type="text/javascript"></script></head><script type="text/javascript"> var fileMediator; /** * 选择文件时的响应 * @param e */ var uploadFileButtoChage = fuctio (e) { if (!("FileReader" i widow) || !("File" i widow)) { alert("您的浏览器不支持html5，请使用google，firefox，ie10等浏览器"); retur; } var files = e.target.files; //调用ayupload上传函数 fileMediator.upLoadFile(files); //清空上传按钮的内容 $("#uploadFileButto").val(""); }; widow.oload = fuctio () { /****初始化ayupload开始*****/ fileMediator = ew ayupload.FileMediator(); //设置ayupload的容器对象 fileMediator.iitView($("#ayUploadCotaier")); //设置ayupload的上传地址 ayupload.uploadFileProxy.url = "https://localhost:8080/AyUploadServer/s"; /****初始化ayupload结束*****/ $("#uploadFileButto").o("chage", uploadFileButtoChage); }</script><body><!--上传按钮--><iput type="file" class="myFile_PJY" multiple="multiple" id="uploadFileButto" style="margi-left: 50px;margi-top: 20px"/><!--ayupload容器div--><div id="ayUploadCotaier" style="width: 800px;margi-top: 50px;"></div></body></html>AyUploadClietjs源码打包cd AyUploadCliet/js/ayuploadpm istall -g grut-clipm istallgrutAyUploadServer怎么使用如果测试，直接启动AyUploadServer即可，不需要修改配置如果融入其他项目，按照AyUploadServer代码示例需要提供两个接口message MD5CheckC{strig hOpCode=1;strig fileBaseMd5=2;//md5strig userFileName=3;//文件名strig userFoldParetId=4;//父类文件夹idit64 fileBaseTotalSize=5;//文件总大小strig userFileId=6;//文件id}message MD5CheckS{strig hOpCode=1;it32 result=2;//结果1：秒传，2：可以上传it64 fileBasePos=3;//开始位置it32 uploadMaxLegth=4;//一次上传最大长度strig userFileId=5;//文件id}message UploadFileC{strig hOpCode=1;strig userFileId=2;//文件idit64 fileBasePos=3;//开始位置it32 uploadLegth=4;//上传的长度}message UploadFileS{strig hOpCode=1;it32 result=2;//结果1：秒传，2：可以上传，3上传完成it64 fileBasePos=3;//开始位置it32 uploadMaxLegth=4;//一次上传最大长度strig userFileId=5;//文件idit32 waitTime=6;//等待时间}
评论