Java利用jQuery的ajaxFileUpload异步上传文件的几种方式

ajaxFileUpload实现异步上传文件

一、ajaxFileUpload是一个异步上传文件的jQuery插件。

　　传一个不知道什么版本的上来，以后不用到处找了。

　　语法：$.ajaxFileUpload([options])

　　options参数说明：

1、url　　　　　　　　　　上传处理程序地址。　　
2，fileElementId　　　　　需要上传的文件域的ID，即<input type="file">的ID。
3，secureuri　　　　　　　是否启用安全提交，默认为false。
4，dataType　　　　　　　服务器返回的数据类型。可以为xml,script,json,html。如果不填写，jQuery会自动判断。
5，success　　　　　　　　提交成功后自动执行的处理函数，参数data就是服务器返回的数据。
6，error　　　　　　　　　提交失败自动执行的处理函数。
7，data 　　　　　　　　　自定义参数。这个东西比较有用，当有数据是与上传的图片相关的时候，这个东西就要用到了。
8, type 　　　　　　　　　当要提交自定义参数时，这个参数要设置成post

错误提示:

1，SyntaxError: missing ; before statement错误
　　如果出现这个错误就需要检查url路径是否可以访问
2，SyntaxError: syntax error错误
　　如果出现这个错误就需要检查处理提交操作的服务器后台处理程序是否存在语法错误
3，SyntaxError: invalid property id错误
　　如果出现这个错误就需要检查文本域属性ID是否存在
4，SyntaxError: missing } in XML expression错误
　　如果出现这个错误就需要检查文件name是否一致或不存在
5，其它自定义错误
　　大家可使用变量$error直接打印的方法检查各参数是否正确，比起上面这些无效的错误提示还是方便很多。

　　使用方法：

　　第一步：先引入jQuery与ajaxFileUpload插件。注意先后顺序，这个不用说了，所有的插件都是这样。

    <script src="jquery-1.7.1.js" type="text/javascript"></script>
    <script src="ajaxfileupload.js" type="text/javascript"></script>

　　第二步：HTML代码：

<body>
    <p><input type="file" id="file1" name="file" /></p>
    <input type="button" value="上传" />
    <p><img id="img1" alt="上传成功啦，你妈个B啦" src="" /></p>
</body>

　　第三步：JS代码

    <script src="jquery-1.7.1.js" type="text/javascript"></script>
    <script src="ajaxfileupload.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $(":button").click(function () {
                ajaxFileUpload();
            })
        })
        function ajaxFileUpload() {
            $.ajaxFileUpload
            (
                {
                    url: '/upload.aspx', //用于文件上传的服务器端请求地址
                    secureuri: false, //是否需要安全协议，一般设置为false
                    fileElementId: 'file1', //文件上传域的ID
                    dataType: 'json', //返回值类型 一般设置为json
                    success: function (data, status)  //服务器成功响应处理函数
                    {
                        $("#img1").attr("src", data.imgurl);
                        if (typeof (data.error) != 'undefined') {
                            if (data.error != '') {
                                alert(data.error);
                            } else {
                                alert(data.msg);
                            }
                        }
                    },
                    error: function (data, status, e)//服务器响应失败处理函数
                    {
                        alert(e);
                    }
                }
            )
            return false;
        }
    </script>

　　　　第四步：后台页面upload.aspx代码：

        protected void Page_Load(object sender, EventArgs e)
        {
            HttpFileCollection files = Request.Files;
            string msg = string.Empty;
            string error = string.Empty;
            string imgurl;
            if (files.Count > 0)
            {
                files[0].SaveAs(Server.MapPath("/") + System.IO.Path.GetFileName(files[0].FileName));
                msg = " 成功! 文件大小为:" + files[0].ContentLength;
                imgurl = "/" + files[0].FileName;
                string res = "{ error:'" + error + "', msg:'" + msg + "',imgurl:'" + imgurl + "'}";
                Response.Write(res);
                Response.End();
            }
        }

　　本实例完整代码下载

来一个MVC版本的实例：

控制器代码

    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            return View();
        }

        public ActionResult Upload()
        {
            HttpFileCollection hfc = System.Web.HttpContext.Current.Request.Files;
            string imgPath = "";
            if (hfc.Count > 0)
            {
                imgPath = "/testUpload" + hfc[0].FileName;
                string PhysicalPath = Server.MapPath(imgPath);
                hfc[0].SaveAs(PhysicalPath);
            }
            return Content(imgPath);
        }
    }

前端视图，HTML与JS代码，成功上传后，返回图片真实地址并绑定到<img>的SRC地址

<html>
<head>
    <script src="/jquery-1.7.1.js" type="text/javascript"></script>
    <script src="/ajaxfileupload.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $(":button").click(function () {
                if ($("#file1").val().length > 0) {
                    ajaxFileUpload();
                }
                else {
                    alert("请选择图片");
                }
            })
        })
        function ajaxFileUpload() {
            $.ajaxFileUpload
            (
                {
                    url: '/Home/Upload', //用于文件上传的服务器端请求地址
                    secureuri: false, //一般设置为false
                    fileElementId: 'file1', //文件上传空间的id属性  <input type="file" id="file" name="file" />
                    dataType: 'HTML', //返回值类型 一般设置为json
                    success: function (data, status)  //服务器成功响应处理函数
                    {
                        alert(data);
                        $("#img1").attr("src", data);
                        if (typeof (data.error) != 'undefined') {
                            if (data.error != '') {
                                alert(data.error);
                            } else {
                                alert(data.msg);
                            }
                        }
                    },
                    error: function (data, status, e)//服务器响应失败处理函数
                    {
                        alert(e);
                    }
                }
            )
            return false;
        }
    </script>
</head>
<body>
    <p><input type="file" id="file1" name="file" /></p>
    <input type="button" value="上传" />
    <p><img id="img1" alt="上传成功啦，你妈个B啦" src="" /></p>
</body>
</html>

最后再来一个上传图片且附带参数的实例：控制器代码：

    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            return View();
        }

        public ActionResult Upload()
        {
            NameValueCollection nvc = System.Web.HttpContext.Current.Request.Form;

            HttpFileCollection hfc = System.Web.HttpContext.Current.Request.Files;
            string imgPath = "";
            if (hfc.Count > 0)
            {
                imgPath = "/testUpload" + hfc[0].FileName;
                string PhysicalPath = Server.MapPath(imgPath);
                hfc[0].SaveAs(PhysicalPath);
            }
            //注意要写好后面的第二第三个参数
            return Json(new { Id = nvc.Get("Id"), name = nvc.Get("name"), imgPath1 = imgPath },"text/html", JsonRequestBehavior.AllowGet);
        }
    }

Index视图代码:

<html>
<head>
    <script src="/jquery-1.7.1.js" type="text/javascript"></script>
    <script src="/ajaxfileupload.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $(":button").click(function () {
                if ($("#file1").val().length > 0) {
                    ajaxFileUpload();
                }
                else {
                    alert("请选择图片");
                }
            })
        })
        function ajaxFileUpload() {
            $.ajaxFileUpload
            (
                {
                    url: '/Home/Upload', //用于文件上传的服务器端请求地址
                    type: 'post',
                    data: { Id: '123', name: 'lunis' }, //此参数非常严谨，写错一个引号都不行
                    secureuri: false, //一般设置为false
                    fileElementId: 'file1', //文件上传空间的id属性  <input type="file" id="file" name="file" />
                    dataType: 'json', //返回值类型 一般设置为json
                    success: function (data, status)  //服务器成功响应处理函数
                    {
                        alert(data);
                        $("#img1").attr("src", data.imgPath1);
                        alert("你请求的Id是" + data.Id + "     " + "你请求的名字是:" + data.name);
                        if (typeof (data.error) != 'undefined') {
                            if (data.error != '') {
                                alert(data.error);
                            } else {
                                alert(data.msg);
                            }
                        }
                    },
                    error: function (data, status, e)//服务器响应失败处理函数
                    {
                        alert(e);
                    }
                }
            )
            return false;
        }
    </script>
</head>
<body>
    <p><input type="file" id="file1" name="file" /></p>
    <input type="button" value="上传" />
    <p><img id="img1" alt="上传成功啦，你妈个B啦" src="" /></p>
</body>
</html>

此实例在显示出异步上传图片的同时并弹出自定义传输的参数。本实例下载地址

　　2013年1月28日，今天调试过程中发现一个问题，就是作为文件域(<input type="file">)必须要有name属性，如果没有name属性，上传之后服务器是获取不到图片的。如：正确的写法是<input type="file" id="file1" name="file1" />

　　2013年1月28日，最经典的错误终于找到原因所在了。Object function (a,b){return new e.fn.init(a,b,h)} has no method 'handleError'，这个是google浏览器报的错误，非常经典，不知道是我的版本问题还是真正存在的问题。这个问题的根源经过N次上传才找到问题的根本所在。答案是：dataType参数一定要大写。如：dataType: 'HTML'。

1.SSH2下使用ajaxFileUpload控件上传附件

使用jQuery的ajaxFileUpload控件以ajax方式上传附件有较好的用户体验，在某SSH2项目开发中，使用了ajaxFileUpload实现了附件的上传，具体过程如下：

1、引入及修改ajaxFileUpload.js

[html]  view plain copy   
     
    
 <script type="text/javascript" src="<%=basePath%>/js/jquery/jquery-1.8.0.min.js"></script>  
 <script type="text/javascript" src="<%=basePath%>js/ajaxfileupload.js"></script>   

为了使得ajaxfileupload支持IE9、IE10，在ajaxfileupload.js中修改createUploadIframe方法（可参考 http://blog.csdn.net/tiangsu_php/article/details/7795927 ）

[html]  view plain copy   
     
    
  createUploadIframe: function(id, uri)  
     {  
             //create frame  
             var frameId = 'jUploadFrame' + id;          
             if(window.ActiveXObject) {   
                 if(jQuery.browser.version=="9.0"||jQuery.browser.version=="10.0") {   
                     io = document.createElement('iframe');   
                     io.id = frameId;   
                     io.name = frameId;   
                 } else if(jQuery.browser.version=="6.0"||jQuery.browser.version=="7.0"||jQuery.browser.version=="8.0") {   
                     var io = document.createElement('<iframe id="' + frameId + '" name="' + frameId + '" />');   
                     if(typeof uri== 'boolean'){   
                         io.src = 'javascript:false';   
                     }   
                     else if(typeof uri== 'string'){   
                         io.src = uri;   
                     }      
                 }   
 }   

2、form表单及上传控件

form表单设置为：

[html]  view plain copy   
     
 enctype="multipart/form-data" id="addForm" method="post"

上传控件代码为：

[html]  view plain copy   
     
 <input id="upload" name="upload" size="50"   type="file"  />    
 <a class="easyui-linkbutton" iconCls="icon-upload" onclick="ajaxFileUploadCheckType('/sys/file/uploadSysFile.action?fileVo.status=0')" >上传</a>  
  <img src="<%=basePath%>/img/loading_16x16.gif" id="loading"    style="display: none;">

上传的脚本代码为：

[html]  view plain copy   
     
    
     function ajaxFileUploadCheckType(url){        
          var str="";      
          var re=new RegExp("(.pdf|.PDF)$");  
              var upload=$("#upload").val();      
          if(upload=="")         
                str+="请选择要上传的附件！<br/>";   
              else if(!re.test(upload.toLowerCase()))  
                str+="请上传PDF格式的文件！！";      
          if(str=="")  
                 ajaxFileUpload(url);  
           else  
                 alert(str);       
     }  
         //文件上传  
         function ajaxFileUpload(url1)  
             {  
               $("#loading")  
                 .ajaxStart(function(){  
                     $(this).show();  
                 })//开始上传文件时显示一个等待图片  
                 .ajaxComplete(function(){      
                     $(this).hide();  
                 });//文件上传完成将图片隐藏起来  
                 var fileSelect=$("#fileSelect").val(); //是否选择了文件类型  
                 var url2=url1;  
                 if(fileSelect!=undefined&&fileSelect!=null&&fileSelect!=''){  
                 if(url1.indexOf('?')>0)  
                   url2=encodeURI(url1+"&fileVo.fileTypeId="+fileSelect);  
                 else  
                   url2=encodeURI(url1+"?fileVo.fileTypeId="+fileSelect);    
                 }   
                 var tableName=$("#tableName").val();       
                 if(url2.indexOf('?')>0)  
                      url2=encodeURI(url2+"&fileVo.tableName="+tableName);  
                 else  
                     url2=encodeURI(url2+"?fileVo.tableName="+tableName);  
                 var fid=$("#fid").val();  
                 if(url2.indexOf('?')>0)  
                      url2=encodeURI(url2+"&fileVo.fid="+fid);  
                 else    
                     url2=encodeURI(url2+"?fileVo.fid="+fid);                
                 $.ajaxFileUpload     
                 (                       
                     {           
                         url:url2,//用于文件上传的服务器端请求地址       
                         secureuri:false,//一般设置为false  
                         fileElementId:'upload',//文件上传空间的id属性  <input type="file" id="upload" name="upload" />                        
                         // type:'POST',    
                         dataType: 'text',//返回值类型 一般设置为json       
                         //contentType: "application/x-www-form-urlencoded; charset=utf-8",  
                         success: function (data, status)  //服务器成功响应处理函数  
                         {                                    
                            //alert((data));                 
                             var result=eval('('+data+')');        
                             generateFileList(result,"type"); //使用ajax方式重新长生附件列表                             
                                                               
                         },  
                         error: function (data, status, e)//服务器响应失败处理函数  
                         {        
                             $.messager.alert('错误提示',"文件上传出现异常，请重新上传或联系管理员！","error");  
                         }  
                     }  
                 )              
                 return false;  
             }  
         

3、Struts2的XML配置及服务器端处理

XML配置：

[html]  view plain copy   
     
    
      <package name="sys.file" namespace="/sys/file" extends="globalpackage">  
 lt;action name="uploadSysFile" class="com.cnpc.sys.action.FileUploadAction"  
 method="uploadSysFile">  
 lt;/action>  
       ……  

服务器端Action处理：

[html]  view plain copy   
     
    
 package com.cnpc.sys.action;  
   
 import java.io.File;  
 import java.io.FileInputStream;  
 import java.io.FileOutputStream;  
 import java.io.IOException;  
 import java.util.ArrayList;  
 import java.util.Date;  
 import java.util.List;  
   
 import javax.servlet.http.HttpServletRequest;  
 import javax.servlet.http.HttpServletResponse;  
   
 import org.apache.struts2.ServletActionContext;  
   
 import com.cnpc.framework.common.action.BaseAction;  
 import com.cnpc.framework.common.exception.GlobalException;  
 import com.cnpc.framework.common.servicefactory.SystemInstance;  
 import com.cnpc.sys.entity.Dictionary;  
 import com.cnpc.sys.entity.Employee;  
 import com.cnpc.sys.service.IDictionaryService;  
 import com.cnpc.sys.service.IEmployeeService;  
 import com.cnpc.sys.service.ISysFileService;  
 import com.cnpc.sys.vo.SysFileVo;  
 import com.cnpc.utils.DateUtils;  
 import com.cnpc.utils.PropertiesTools;  
 import com.cnpc.utils.StrUtils;  
   
   
 //附件上传处理类  
 public class FileUploadAction extends BaseAction {  
     private ISysFileService sysFileService = (ISysFileService) SystemInstance  
             .getInstance().getBean(ISysFileService.class);  
     private IDictionaryService dictionaryService = (IDictionaryService) SystemInstance  
             .getInstance().getBean(IDictionaryService.class);  
     private IEmployeeService employeeService = (IEmployeeService) SystemInstance  
     .getInstance().getBean(IEmployeeService.class);  
     private SysFileVo fileVo;  
     private File upload;// 实际上传文件  
     private String uploadContentType; // 文件的内容类型  
     private String uploadFileName; // 上传文件名  
     private List<SysFileVo> fileVoList;  
     private String message = "你已成功上传文件";  
     private String tableName;  
     private String year;  
     private List<SysFileVo> volist;  
   
       
       
     public String getYear() {  
         return year;  
     }  
   
     public void setYear(String year) {  
         this.year = year;  
     }  
   
     public String getTableName() {  
         return tableName;  
     }  
   
     public void setTableName(String tableName) {  
         this.tableName = tableName;  
     }  
   
     public List<SysFileVo> getVolist() {  
         return volist;  
     }  
   
     public void setVolist(List<SysFileVo> volist) {  
         this.volist = volist;  
     }  
   
     public SysFileVo getFileVo() {  
         return fileVo;  
     }  
   
     public void setFileVo(SysFileVo fileVo) {  
         this.fileVo = fileVo;  
     }  
   
     public File getUpload() {  
         return upload;  
     }  
   
     public void setUpload(File upload) {  
         this.upload = upload;  
     }  
   
     public String getUploadContentType() {  
         return uploadContentType;  
     }  
   
     public void setUploadContentType(String uploadContentType) {  
         this.uploadContentType = uploadContentType;  
     }  
   
     public String getUploadFileName() {  
         return uploadFileName;  
     }  
   
     public void setUploadFileName(String uploadFileName) {  
         this.uploadFileName = uploadFileName;  
     }  
   
     public List<SysFileVo> getFileVoList() {  
         return fileVoList;  
     }  
   
     public void setFileVoList(List<SysFileVo> fileVoList) {  
         this.fileVoList = fileVoList;  
     }  
   
     public String getMessage() {  
         return message;  
     }  
   
     public void setMessage(String message) {  
         this.message = message;  
     }  
   
     public String uploadSysFile() throws GlobalException, IOException {  
         String isAll=fileVo.getIsAll();  
         Employee emp = employeeService.getEmployeeByID(getSessionContainer().getUserId());  
         if (fileVo == null) {    
             fileVo = new SysFileVo();     
         }       
         String[] str = saveUpload();  
         fileVo.setFileName(str[0]);  
         fileVo.setVirtualName(str[1]);  
         fileVo.setFilePath(str[2].replace("\\", "\\\\"));  
         if (fileVo != null) {  
   
             if (fileVo.getEmpid() == null) {         
                 Integer empid = emp.getEmpid();  
                 fileVo.setEmpid(empid);  
             }  
             if (fileVo.getUploadTime() == null) {  
                 fileVo.setUploadTime(DateUtils.format(new Date(System  
                         .currentTimeMillis()), DateUtils.formatStr_yyyyMMdd));  
             }  
             if (fileVo.getTableName() == null) {  
                 fileVo.setTableName(tableName);  
             }  
             if(fileVo.getYear()==null){  
                 if(year==null)  
                     year=DateUtils.getYear();     
                 fileVo.setYear(year);  
             }  
             if(fileVo.getIid()==null){  
                 fileVo.setIid(emp.getInstitute().getIid());   
             }             
             fileVo = sysFileService.addSysFileVo(fileVo);  
         }  
         if (fileVoList == null) {  
             fileVoList = new ArrayList<SysFileVo>();  
         }       
         fileVo.setIsAll(isAll);  
         if(fileVo.getIsAll()!=null&&fileVo.getIsAll().equals("1")){  
             fileVoList = sysFileService.getAllSysFileByInfoId(  
                     fileVo.getTableName(), fileVo.getFid());          
         }else{  
             fileVoList = sysFileService.getSysFileByInfoId(  
                     fileVo.getTableName(),null, fileVo.getFid(),fileVo.getStatus());   
         }  
         String jsonStr = getJsonForFileList(fileVoList);  
         HttpServletResponse response = getCurrentResponse();  
         HttpServletRequest request=getCurrentRequest();  
         request.setCharacterEncoding(ENCODING);  
         response.setCharacterEncoding(ENCODING);  
         response.setContentType("text/html");    
         outPutString(jsonStr);           
         return NONE;    
     }  
   
       
   
     public String getJsonForFileList(List<SysFileVo> filelist) {  
         if (filelist == null)  
             return "[]";  
         StringBuffer buffer = new StringBuffer("[");  
         for (SysFileVo vo : filelist) {  
             buffer.append("{'id':'" + vo.getFileId() + "' ,'name':'"  
                     + vo.getFileName() + "','path':'"  
                     + vo.getFilePath().replace("\\", "\\\\") + "','typeName':'"  
                     + vo.getFileTypeName() + "','typeid':'"  
                     + vo.getFileTypeId() + "','status':'"  
                     + vo.getStatus() + "'},");           
         }  
         if (buffer.length() > 1)  
             buffer = new StringBuffer(buffer.substring(0, buffer.length() - 1));  
         buffer.append("]");    
         return buffer.toString();  
     }  
   
     @SuppressWarnings("deprecation")  
     public String[] saveUpload() throws IOException {  
         String[] result = new String[3];  
         try {  
             if (uploadFileName != null && !"".equals(uploadFileName)) {  
                 String trueName = uploadFileName.substring(uploadFileName  
                         .lastIndexOf("/") + 1, uploadFileName.length());  
                 String fileName = new Date().getTime()  
                         + com.cnpc.utils.FileUtils.getExtention(uploadFileName);  
                 String path = PropertiesTools.getPropertiesValueByFileAndKey(  
                         "globalParameters.properties", "uploadPath");  
                 String targetDirectory = path;  
                 String targetFileName = fileName;  
                 // 以服务器的文件保存地址和原文件名建立上传文件输出流  
                 FileOutputStream fos = new FileOutputStream(path + "\\"  
                         + fileName);  
                 // 以上传文件建立一个文件上传流  
                 FileInputStream fis = new FileInputStream(upload);  
                 // 将上传文件的内容写入服务器  
                 byte[] buffer = new byte[1024];  
                 int len = 0;  
                 while ((len = fis.read(buffer)) > 0) {  
                     fos.write(buffer, 0, len);  
                 }  
                 fis.close();  
                 fos.flush();  
   
                 result[0] = trueName;  
                 result[1] = fileName;  
                 result[2] = path + "\\" + fileName;  
             }  
         } catch (Exception e) {  
             e.printStackTrace();  
             message = "对不起,文件上传失败了!!!!";  
         }  
         return result;  
     }  
   
     public String deleteSysFile() throws GlobalException, IOException {       
         if (fileVo != null && fileVo.getFileId() != null) {  
             SysFileVo deleteVo = sysFileService.getSysFileByID(fileVo  
                     .getFileId());  
             deleteFile(deleteVo.getFilePath());        
             sysFileService.deleteSysFileByVoId(deleteVo.getFileId());  
             if (fileVoList == null) {      
                 fileVoList = new ArrayList<SysFileVo>();  
             }  
             if(fileVo.getIsAll()!=null&&fileVo.getIsAll().equals("1")){  
                 fileVoList = sysFileService.getAllSysFileByInfoId(      
                         deleteVo.getTableName(), deleteVo.getFid());              
             }else{            
                 fileVoList = sysFileService.getSysFileByInfoId(deleteVo.getTableName(),null, deleteVo.getFid(),deleteVo.getStatus());   
             }  
         }  
         String jsonStr = getJsonForFileList(fileVoList);  
         HttpServletResponse response = getCurrentResponse();  
         HttpServletRequest request=getCurrentRequest();  
         request.setCharacterEncoding(ENCODING);  
         response.setCharacterEncoding(ENCODING);  
         response.setContentType("text/html");    
         outPutString(jsonStr);  
         return NONE;  
     }  
   
       
   
     public String downloadFile() throws Exception {  
         SysFileVo filevo = sysFileService  
                 .getsysfilebypath(fileVo.getFilePath());  
         HttpServletResponse response = getCurrentResponse();  
         HttpServletRequest request=getCurrentRequest();  
         request.setCharacterEncoding(ENCODING);  
         response.setCharacterEncoding(ENCODING);     
         response.setContentType("text/html");    
         if (filevo != null) {  
             setCurrentAttribute("filename", filevo.getFileName());  
             setCurrentAttribute("fileurl", filevo.getFilePath());  
         } else {  
             setCurrentAttribute("filename", fileVo.getFileName());  
             setCurrentAttribute("fileurl", fileVo.getFilePath());  
         }  
         return "download";  
     }  
   
     public void deleteFile(String path) {  
         String targetDirectory = ServletActionContext.getRequest().getRealPath(  
                 "");  
         File target = new File(targetDirectory, path);  
         if (target.exists()) {  
             target.delete();  
         } else {  
             System.out.println("文件不存在");  
         }  
     }  
   
     public String ajaxCheckFile() throws IOException {  
         String typeids = getCurrentParameter("typeids");  
         String dictCode = getCurrentParameter("dictCode");  
         // List<SysFileVo> filelist=sysFileService.getSysFileByInfoId(tabName,  
         // Integer.valueOf(id));  
         String[] arrType = null;  
         if (!StrUtils.isEmpty(typeids))  
             arrType = typeids.substring(0, typeids.length() - 1).split(",");  
         List<Dictionary> dictlist = dictionaryService  
                 .getDictsByDictCode(dictCode);  
         String str = "";  
         boolean isExist = false;  
         for (Dictionary dict : dictlist) {  
             isExist = false;  
             if (dict.getIsCheck() != null && dict.getIsCheck().equals("1")) {  
                 if (arrType != null) {  
                     for (String typeid : arrType) {  
                         if (dict.getDictid().equals(Integer.valueOf(typeid))) {  
                             isExist = true;  
                             break;  
                         }        
                     }  
                 }  
                 if (!isExist)  
                     str += dict.getDictName() + "不能为空！\r\n";  
             }  
         }  
         outPutString(str);  
         return NONE;  
     }  
   
 }  

FileUploadAction包含了附件上传、删除、生成json附件列表功能，该处理类是直接复制、粘贴项目源代码而来，如果使用，请按照需求进行增删。

以上三个步骤就在SSH2中完成了ajaxFileUpload控件上传附件的功能，仅供参考。

2.AjaxFileUpload组件结合Struts2异步图片上传

使用AjaxFileUpload组件结合Struts2异步上传需要添加如下文件：

ajaxfileupload.js

jquery-x.x.x-min.js

struts2相关jar包

AjaxFileUpload组件下载连接：http://download.csdn.net/detail/yangfuqian/4337967

具体实现代码：

服务端：

[html]  view plain copy   
     
    
 package com.tenghu.action.upload;  
 import java.io.File;  
 import java.io.FileInputStream;  
 import java.io.FileOutputStream;  
 import java.io.InputStream;  
 import java.io.OutputStream;  
 import javax.servlet.http.HttpServletRequest;  
   
 import org.apache.struts2.ServletActionContext;  
 import com.opensymphony.xwork2.ActionSupport;  
 /**  
  * 文件上传Action  
  * @author xiaohu  
  *  
  */  
 public class FileUpload extends ActionSupport{  
     private String name;  
     //封装上传文件域的属性  
     private File file;  
     //封装上传文件类型的属性  
     private String fileContentType;  
     //封装上传文件名的属性  
     private String fileFileName;  
     //提示信息  
     private String json_message;  
       
     private String JSON_MESSAGE="json_message";  
       
     @Override  
     public String execute() throws Exception {  
         try {  
             //设置文件保存目录  
             String saveDir=getRootPath()+"/images";  
             File saveFile=new File(saveDir);  
             //判断  
             if(!saveFile.exists()){  
                 saveFile.mkdirs();  
             }  
             //时间戳  
             String timeStr="zycs"+System.currentTimeMillis();  
             //获取文件后缀  
             String fileSuffix=fileFileName.substring(fileFileName.indexOf("."));  
             //拼接文件名  
             String fileName=timeStr+fileSuffix;  
             //创建文件输出流对象  
             OutputStream fos=new FileOutputStream(saveDir+"/"+fileName);  
             //创建文件输入流对象  
             InputStream fis=new FileInputStream(file);  
             //创建缓冲数组  
             byte[] buffer=new byte[1024];  
             int len=0;  
             //从输入流中将数据写入到输出流中  
             while((len=fis.read(buffer))!=-1){  
                 //写入  
                 fos.write(buffer,0,len);  
             }  
             //关闭资源  
             fis.close();  
             fos.close();  
             //上传成功地址  
             String successPath=getUrl()+"/images/"+fileName;  
             json_message="{\"result\":1,\"message\":\""+successPath+"\"}";  
         } catch (Exception e) {  
             e.printStackTrace();  
             json_message="{\"result\":0}";  
         }  
         return JSON_MESSAGE;  
     }  
     /**  
      * 返回服务器http地址  
      * @return  
      */  
     private String getUrl(){  
         HttpServletRequest request=ServletActionContext.getRequest();  
         return "http://"+request.getRemoteHost()+request.getContextPath();  
     }  
       
     /**  
      * 获取项目根目录  
      * @return  
      */  
     private String getRootPath(){  
         String filePath = Thread.currentThread().getContextClassLoader()  
                 .getResource("").toString();  
         if (filePath.toLowerCase().indexOf("file:") > -1) {  
             filePath = filePath.substring(6, filePath.length());  
         }  
         if (filePath.toLowerCase().indexOf("classes") > -1) {  
             filePath = filePath.replaceAll("/classes", "");  
         }  
         if (filePath.toLowerCase().indexOf("web-inf") > -1) {  
             filePath = filePath.substring(0, filePath.length() - 9);  
         }  
         if (System.getProperty("os.name").toLowerCase().indexOf("window") < 0) {  
             filePath = "/" + filePath;  
         }  
   
         if (filePath.endsWith("/"))  
             filePath = filePath.substring(0, filePath.length() - 1);  
   
         return filePath;  
     }  
   
     public String getName() {  
         return name;  
     }  
   
     public void setName(String name) {  
         this.name = name;  
     }  
   
     public File getFile() {  
         return file;  
     }  
   
     public void setFile(File file) {  
         this.file = file;  
     }  
   
     public String getFileContentType() {  
         return fileContentType;  
     }  
   
     public String getJson_message() {  
         return json_message;  
     }  
     public void setJson_message(String jsonMessage) {  
         json_message = jsonMessage;  
     }  
     public void setFileContentType(String fileContentType) {  
         this.fileContentType = fileContentType;  
     }  
   
     public String getFileFileName() {  
         return fileFileName;  
     }  
   
     public void setFileFileName(String fileFileName) {  
         this.fileFileName = fileFileName;  
     }  
 }  

如果希望获取到上传图片的宽和高，可以添加以下代码：

[html]  view plain copy   
     
    
 //获取图片缓冲流对象  
             BufferedImage image=ImageIO.read(fis);  
             image.getWidth();//图片宽  
             image.getHeight();//图片高  

这里的fis表示：InputStream输入流，也可以直接传入File文件对象

js代码：

[html]  view plain copy   
     
    
 <script type="text/javascript">  
     $(document).ready(function() {  
         //调用初始化方法  
             UPLOAD.init();  
         });  
   
     var UPLOAD = {  
         wWidth : $(window).width(),//获取浏览器可视化宽度  
         wHeight : $(window).height(),//获取浏览器可视化高度  
         //初始化上传文件窗口的位置  
         init : function() {  
             //获取窗口div对象  
             var uObj = $(".w_sub");  
             //设置上传窗口位置  
             uObj.css( {"left" : (this.wWidth - uObj.width()) / 2,"top" : (this.wHeight - uObj.height()) / 2});  
             //点击上传按钮显示上传窗口  
             $("#upload").click(function(){$("#upload_w").show();});  
               
             //调用关闭窗口  
             this.closeUp();  
             //调用关闭预览窗口  
             this.closePre();  
             //调用上传函数  
             this.btnUpload();  
             //调用预览图片  
             this.btnPreview();  
             this.dragDrop();  
               
         },  
         //关闭上传窗口  
         closeUp:function(){  
             $(".close").click(function(){$("#upload_w").hide();});  
         },  
         //关闭预览窗口  
         closePre:function(){  
             $(".pre").click(function(){$(".preview_w").hide();});  
         },//点击上传  
         btnUpload:function(){  
             $(".sub_upload").click(function(){  
                 var file=$("#file").val();  
                 if(file==""){  
                     alert("请选择需要上传的图片");  
                     return;  
                 }else{  
                     //判断上传文件格式  
                     var suffixs=new Array("jpg","gif","png");  
                     //截取上传文件格式  
                     var fileType=file.substring(file.lastIndexOf('.')+1);  
                     if($.inArray(fileType,suffixs)<=-1){  
                         alert("图片格式错误");  
                         return;  
                     }else{  
                         var uploadUrl="uploadFile?time="+new Date().getTime();  
                         //异步上传  
                         $.ajaxFileUpload({  
                             url:uploadUrl,  
                             secureuri:false,  
                             fileElementId:"file",//上传id，这里是<input type="file" name="file" id="file"/>  
                             dataType:'text',  
                             success:function(data,status){  
                                 var json=$.parseJSON(data);  
                                 if(json.result==1){  
                                     $("#upload_w").hide();  
                                     $(".url").val(json.message);  
                                 }else{  
                                     alert("上传失败!");  
                                 }  
                                   
                             },  
                             error:function(){  
                                 alert("异步失败");  
                             }  
                         });  
                     }  
                 }  
             });  
         },  
         //点击预览  
         btnPreview:function(){  
             //点击预览图片  
             $("#proview_img").click(function(){  
                 //获取文本框中的路径  
                 var imagePath=$(".url").val();  
                 if(imagePath!=""){  
                     $("#image").attr("src",$(".url").val());  
                     $(".preview_w").show();  
                 }else{  
                     alert("还有上传图片");  
                 }  
             });  
         },  
         /**  
         *拖拽弹窗  
         */  
         dragDrop:function(){  
             var self=this;  
             var move=false;//标识是否移动元素  
             var offsetX=0;//弹窗到浏览器left的宽度  
             var offsetY=0;//弹出到浏览器top的宽度  
             var title=$(".title");  
             boxContent=$(".preview");  
             //鼠标按下事件  
             title.mousedown(function(){  
                 move=true;//当鼠标按在该div上的时间将move属性设置为true  
                 offsetX=event.offsetX;//获取鼠标在当前窗口的相对偏移位置的Left值并赋值给offsetX  
                 offsetY=event.offsetY;//获取鼠标在当前窗口的相对偏移位置的Top值并赋值给offsetY  
                 title.css({"cursor":"move"});  
             }).mouseup(function(){  
                 //当鼠标松开的时候将move属性摄hi为false  
                 move=false;  
             });  
             $(document).mousemove(function(){  
                 if(!move){//如果move属性不为true，就不执行下面的代码  
                     return;  
                 }  
                 //move为true的时候执行下面代码  
                 var x = event.clientX-offsetX; //event.clientX得到鼠标相对于客户端正文区域的偏移，然后减去offsetX即得到当前推拽元素相对于当前窗口的X值（减去鼠标刚开始拖动的时候在当前窗口的偏移X）  
                 var y = event.clientY-offsetY; //event.clientY得到鼠标相对于客户端正文区域的偏移，然后减去offsetX即得到当前推拽元素相对于当前窗口的Y值（减去鼠标刚开始拖动的时候在当前窗口的偏移Y）  
                 if(!(x<0||y<0||x>(self.wWidth-boxContent.width())||y>(self.wHeight-boxContent.height()))){  
                     boxContent.css({"left":x,"top":y,"cursor":"move"});  
                 }  
             });  
         }  
     }  
 </script>  

这里使用的ajaxfileupload异步上传组件

html代码：

[html]  view plain copy   
     
    
 <body>  
         上传后的文件路径：  
         <input type="text" class="url" />  
         <span id="upload">上传</span>   
         <span id="proview_img">预览</span>  
         <br/>  
           
         <!-- 上传文件弹窗 -->  
         <div id="upload_w">  
             <!-- 遮盖部分 -->  
             <div class="cover"></div>  
             <div class="w_sub">  
                 <form action="" method="post" enctype="multipart/form-data">  
                     <table width="100%" cellpadding="0" cellspacing="0">  
                         <tr><th class="title">图片上传<span class="close">×</span></th></tr>  
                         <tr><td style="padding-left: 20px">选择图片文件：<br />  
                             <input type="file"style="width: 95%; border: 1px solid #ddd; height: 25px; border-radius: 3px" name="file" id="file">  
                             </td>  
                         </tr>  
                         <tr><td>${promptInfo }</td></tr>  
                         <tr height="50px">  
                             <td align="center"><input type="button" value="上传" class="sub_upload" /></td>  
                         </tr>  
                     </table>  
                 </form>  
             </div>  
         </div>  
           
         <!-- 预览图片窗口 -->  
         <div class="preview_w">  
             <!-- 遮盖部分 -->  
             <div class="cover"></div>  
             <div class="preview">  
                 <table width="100%" cellpadding="0" cellspacing="0">  
                     <tr><th class="title">图片预览<span class="pre">×</span></th></tr>  
                     <tr>  
                         <td style="padding: 20px">  
                             <img src="" id="image"/>  
                         </td>  
                     </tr>  
                 </table>  
             </div>  
         </div>  
     </body>  

css代码：

[html]  view plain copy   
     
    
 <style type="text/css">  
 * {  
     margin: 0px;  
     padding: 0px;  
 }  
   
 body {  
     font: normal 15px/ 30px '微软雅黑'  
 }  
   
 .url {  
     width: 250px;  
     height: 30px;  
     border: 1px solid #CCCCCC;  
     border-radius: 4px;  
 }  
   
 span {  
     color: #999999;  
     cursor: pointer;  
 }  
   
 span:hover {  
     color: orange  
 }  
   
 /*上传文件弹窗效果*/  
 #upload_w,.preview_w{display: none;}  
   
 .cover {  
     width: 100%;  
     height: 100%;  
     filter: alpha(opacity = 30);  
     -moz-opacity: 0.3;  
     -khtml-opacity: 0.3;  
     opacity: 0.3;  
     background: #CCCCCC;  
     position: fixed;  
     top: 0  
 }  
   
 .w_sub {  
     height: 150px;  
     width: 350px;  
     border: 3px solid #2CB9F2;  
     background: #FFFFFF;  
     position: fixed;  
     padding: 10px;  
 }  
   
 /*上传按钮*/  
 .sub_upload {  
     height: 30px;  
     width: 70px;  
     background-color:#0A86CB;  
     border-right:2px solid #0879B9;  
     border-bottom:2px solid #0879B9;  
     color:#FFFFFF;  
 }  
 .close,.pre{  
     color:#2CB9F2;  
     color:#0879B9;  
     font-size: 25px;  
     float: right;  
     margin-right: 8px;  
     line-height: 25px;  
     cursor: pointer;  
 }  
 .preview{  
     position: fixed;  
     padding: 10px;  
     border: 3px solid #2CB9F2;  
     background:#FFFFFF;  
     top:100px;  
     left:100px;  
 }  
   
 table{border:1px solid #2CB9F2}  
 .title{  
      height:35px;  
      background-color: #D6DEE3;  
      font:normal 15px '微软雅黑';  
      text-align: left;  
      padding-left: 10px;  
      color:#4C5A5F;  
 }  
 </style>  

需要引入js文件：

[html]  view plain copy   
     
    
 <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>  
         <script type="text/javascript" src="js/ajaxfileupload.js"></script>  

实现效果：

初始化界面：

上传窗口：

上传成功后将文件路径放入文本框中：

预览窗口：

3.springMVC + ajaxfileupload异步上传图片预览，裁剪并保存图片

1、整体效果图：

2、实现原理：

（1）利用input的onchange事件异步上传图片到服务器

（2）获取上传图片的相对地址，回显到img标签中

（3）利用jcrop裁剪图片，提交给后台裁剪的起始坐标，宽度、高度

（4）后台裁剪图片并保存

3、用到的插件：

（1）JCrop图片裁剪插件

（2）异步上传图片插件：Ajaxfileupload.js

4、实现：

（1）jsp关键代码：

[html]  view plain copy print ? 
     
    
 <fieldset>  
     <legend>头像上传</legend>  
     <!-- 显示图片的img -->  
     <img src="" id="realPic" width="400px" height="400px" />  
     <!-- 缩略图预览 -->  
     <div id="preview-pane">  
         <div class="preview-container">  
             <img src="" width="150px" height="150px" />  
         </div>  
     </div>  
     <div class="container">  
         <!-- 打开图片控制 -->  
                 <span class="btn btn-success fileinput-button">   
                     <i class="icon-plus icon-white"></i>   
                     <span>选择图片</span>   
                     <input type="file" onchange="ajaxFileUpload()" name="realPicFile" id="realPicFile" multiple />  
                 </span>  
                <!--       
                这种做法IE不支持，拒绝访问.                                                          
                <input id="realPicFile" value="选择图片" onchange="ajaxFileUpload()" type="file" style="display: none;" name="realPicFile" />  
                <a class="btn btn-success" href="javascript:selectPic();" > <i class="icon-plus icon-white"></i>  
                     选择图片   
                </a>  
                 -->  
         <!-- 上传并裁剪图片 -->  
         <img src="${ctx}/images/ajax-loader.gif" id="loading" style="display: none;">    
         <a class="btn btn-success" href="javascript:cutPic();"><i class="icon-picture icon-white"></i>保存头像</a>  
         <!-- 获取裁剪的起始坐标和宽度、高度给后台 -->  
         <form id="coords" class="coords">  
             <div class="inline-labels">  
                 <input type="hidden" size="4" id="x1" name="x1" />  
                 <input type="hidden" size="4" id="y1" name="y1" />  
                 <input type="hidden" size="4" id="x2" name="x2" />  
                 <input type="hidden" size="4" id="y2" name="y2" />  
                 <input type="hidden" size="4" id="w" name="w" />  
                 <input type="hidden" size="4" id="h" name="h" />  
             </div>  
          </form>  
     </div>  
 </fieldset>  

控制样式的CSS ：

[css]  view plain copy print ? 
     
    
 .jcrop-holder #preview-pane {  
   width:156px;  
   height:156px;   
   display: block;  
   position: absolute;  
   /*z-index: 2000;*/  
   top: 0px;  
   right: -200px;  
   padding: 6px;  
   border: 1px rgba(0,0,0,.4) solid;  
   background-color: white;  
   
   -webkit-border-radius: 6px;  
   -moz-border-radius: 6px;  
   border-radius: 6px;  
   
   -webkit-box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.2);  
   -moz-box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.2);  
   box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.2);  
 }  
   
 /* The Javascript code will set the aspect ratio of the crop 
    area based on the size of the thumbnail preview, 
    specified here */  
 #preview-pane .preview-container {  
   width: 156px;  
   height: 156px;  
   overflow: hidden;  
 }  
 #target-pane {  
     width: 400px;  
     height: 400px;  
 }  
   
   
 .fileinput-button {  
   position: relative;  
   overflow: hidden;  
 }  
 .fileinput-button input {  
   position: absolute;  
   top: 0;  
   right: 0;  
   margin: 0;  
   opacity: 0;  
   filter: alpha(opacity=0);  
   transform: translate(-300px, 0) scale(4);  
   font-size: 23px;  
   direction: ltr;  
   cursor: pointer;  
 }  

注意fileinput-button这个样式，本人对css不熟悉，所以这个代码是从jquery-file-upload插件中拷贝过来的，大概的意思是将file的input放到按钮上，置为透明，这样就能够兼容IE，否则如果隐藏input，而触发它的click事件，IE认为这样做不安全，报拒绝访问的错误。

（2）、javascript关键代码：

[javascript]  view plain copy print ? 
     
    
 //Create variables (in this scope) to hold the API and image size  
 var jcrop_api, boundx, boundy, path;  
 /** 
  * 更新缩略图，实现原理：根据原图框选的内容，显示到缩略图上，而缩略图也是原图是进行了放大，只是超过img范围的部分被隐藏 
  */  
 function updatePreview(c) {  
     if (parseInt(c.w) > 0) {  
         $('#x1').val(c.x);  
         $('#y1').val(c.y);  
         $('#x2').val(c.x2);  
         $('#y2').val(c.y2);  
         $('#w').val(c.w);  
         $('#h').val(c.h);  
         
         var rx = xsize / c.w;  
         var ry = ysize / c.h;  
   
         // 精确计算图片的位置  
         $pimg.css({  
             width : Math.round(rx * boundx) + 'px',  
             height : Math.round(ry * boundy) + 'px',  
             marginLeft : '-' + Math.round(rx * c.x) + 'px',  
             marginTop : '-' + Math.round(ry * c.y) + 'px'  
         });  
     }  
 }  
   
 /** 
  * 异步上传图片 
  * @returns {Boolean} 
  */  
 function ajaxFileUpload() {  
     $("#loading").ajaxStart(function() {  
         $(this).show();  
     })//开始上传文件时显示一个图片    
     .ajaxComplete(function() {  
         $(this).hide();  
     });//文件上传完成将图片隐藏起来    
   
     var file = $("#realPicFile").val();  
     if(!/\.(gif|jpg|jpeg|png|JPG|PNG)$/.test(file))  
     {  
         Error("不支持的图片格式.图片类型必须是.jpeg,jpg,png,gif格式.");  
         return false;  
     }  
       
     $.ajaxFileUpload({  
         url : Util.getContentPath() + '/user/uploadHeaderPicTmp.do?inputId=realPicFile',//用于文件上传的服务器端请求地址    
         secureuri : false,//一般设置为false    
         fileElementId : 'realPicFile',//文件上传空间的id属性  <input type="file" id="file" name="file" />    
         dataType : 'json',//返回值类型 一般设置为json    
         success : function(data, status) //服务器成功响应处理函数    
         {     
             // 图片在服务器上的相对地址，加随机数防止不刷新  
             path = Util.getContentPath() + data.path + "?" + Math.random();  
             $("#realPic").attr("src", path);  
             var imgs = $(".jcrop-holder").find("img");  
             // 原本有图片，重新上传后，所有的img都需要刷新  
             imgs.each(function (i, v) {  
                 $(this).attr("src", path);  
             });  
             $('#preview-pane .preview-container img').attr("src", path);  
               
             // 切图样式  
             // Grab some information about the preview pane  
             $preview = $('#preview-pane'), $pcnt = $('#preview-pane .preview-container'), $pimg = $('#preview-pane .preview-container img'),  
             xsize = $pcnt.width(), ysize = $pcnt.height();  
             //console.log('init', [ xsize, ysize ]);  
               
             $('#realPic').Jcrop({  
                 onChange : updatePreview, //切图框改变事件  
                 onSelect : updatePreview, // 切图框选择事件  
                 onRelease: clearCoords, // 切图框释放的事件  
                 bgFade   : true,  
                 bgOpacity: .8, // 截图框以外部分的透明度  
                 setSelect: [10, 10, 100, 100], // 默认选择的区域  
             aspectRatio : 1 //xsize / ysize 截图比例，这里我采用1 : 1 的比例，即切出来的为正方形  
             }, function() {  
                 // Use the API to get the real image size  
                 var bounds = this.getBounds();  
                 boundx = bounds[0];  
                 boundy = bounds[1];  
                 // Store the API in the jcrop_api variable  
                 jcrop_api = this;  
                 // Move the preview into the jcrop container for css positioning  
                 $preview.appendTo(jcrop_api.ui.holder);  
             });  
         },  
         error : function(data, status, e)//服务器响应失败处理函数    
         {  
             Error(e);  
         }  
     });  
     return false;  
 }  
   
 function _getShowWidth(str) {  
     return _getValue(str, "width");  
 }  
   
 function _getShowHeight(str) {  
     return _getValue(str, "height");  
 }  
   
 function _getValue (str, key) {  
     var str = str.replace(/\:|\;|\s/g, '').toLowerCase();  
     var pos = str.indexOf(key);  
     if (pos >= 0) {  
         // 截取  
         var tmp = str.substring(pos, str.length);  
         var px = tmp.indexOf("px");  
         if (px > 0){  
             var width = tmp.substring(key.length, px);  
             return width;  
         }  
         return 0;  
     }  
     return 0;  
 }  
   
 /** 
  * 裁剪图片 
  */  
 function cutPic() {  
     // 初始化数据  
     var x1 = $('#x1').val() == "" ? 0 : $('#x1').val();  
     var y1 = $('#y1').val() == "" ? 0 : $('#y1').val();  
     var x2 = $('#x2').val();  
     var y2 = $('#y2').val();  
     var w = $('#w').val() == "" ? 150 : $('#w').val();  
     var h= $('#h').val() == "" ? 150 : $('#h').val();  
       
     var srcFile = $("#realPic").attr("src");  
     if (srcFile == "" || !srcFile) {  
         Error("没有选择任何图片.");  
         return;  
     }  
        
     var showDiv = $(".jcrop-holder > .jcrop-tracker");  
     // 从压缩存放图片的div中获取压缩后显示的宽度和高度，用来交给后台同比例进行裁剪  
     // width: 404px; height: 304px; position: absolute; top: -2px; left: -2px; z-index: 290; cursor: crosshair;  
     var style = showDiv.attr("style");  
     // 原图片页面显示的宽度  
     var showWidth = _getShowWidth(style);  
     // 原图片页面显示的高度  
     var showHeight = _getShowHeight(style);  
     // console.log(showWidth + " " + showHeight);  
     // 原地图的src地址，去掉后边防止不刷新的随机数  
     srcFile = srcFile.substring(0, srcFile.indexOf("?"));  
     $.ajax({  
         type : "post",  
         dataType : "json",  
         url : Util.getContentPath() + "/user/uploadHeaderPic.do",  
         data : {  
             srcImageFile : srcFile,  
             x : x1,  
             y : y1,  
             destWidth : w,  
             destHeight : h,  
             srcShowWidth : showWidth,  
             srcShowHeight : showHeight,  
         },  
         success : function(data) {  
             var okCallBack = function () {  
                 this.top.window.location = Util.getContentPath() + "/user/pcModiInfoInit.do";  
             };  
             var msg = eval(data);  
             if(msg && msg.msg)  
                 if (msg.code == 1)  
                     Alert(msg.msg, okCallBack);  
                 else Error(msg.msg, okCallBack);  
             else {  
                 Error("上传失败,请稍后重试.", okCallBack);  
                 return;  
             }  
         },  
         error : function () {  
             Error ("上传失败,请稍后重试.") ;  
         }  
     });  
 }  
   
 function clearCoords()  
 {  
   $('#coords input').val('');  
 };  

（3）springMVC代码：

[java]  view plain copy print ? 
     
    
 @RequestMapping("uploadHeaderPicTmp")  
     @ResponseBody  
     public String uploadHeaderPic(String inputId, MultipartHttpServletRequest request) {  
         try {  
             MultipartFile realPicFile = request.getFile(inputId);  
             InputStream in = realPicFile.getInputStream();  
             String path = request.getSession().getServletContext().getRealPath("/");  
             path += TMP;  
             User loginUser = SystemUtil.getLoginUser(request.getSession());  
             String fileName = loginUser.getName() + "." + FilenameUtils.getExtension(realPicFile.getOriginalFilename());  
             File f = new File(path + "/" + fileName);  
             FileUtils.copyInputStreamToFile(in, f);  
             return "{\"path\" : \"" + TMP + "/" + fileName + "\"}";  
         } catch (Exception e) {  
             LOG.error("upload header picture error : ", e);  
         }  
         return null;  
     }  
   
     @RequestMapping("uploadHeaderPic")  
     @ResponseBody  
     public GeneralMessage cutImage(String srcImageFile, int x, int y, int destWidth, int destHeight, int srcShowWidth, int srcShowHeight,  
             HttpServletRequest request) {  
         try {  
             String path = request.getSession().getServletContext().getRealPath("/");  
             Image img;  
             ImageFilter cropFilter;  
             String srcFileName = FilenameUtils.getName(srcImageFile);  
             // 读取源图像    
             File srcFile = new File(path + TMP + "/" + srcFileName);  
   
             BufferedImage bi = ImageIO.read(srcFile);  
             //前端页面显示的并非原图大小，而是经过了一定的压缩，所以不能使用原图的宽高来进行裁剪，需要使用前端显示的图片宽高  
             int srcWidth = bi.getWidth(); // 源图宽度    
             int srcHeight = bi.getHeight(); // 源图高度  
             if (srcShowWidth == 0)  
                 srcShowWidth = srcWidth;  
             if (srcShowHeight == 0)  
                 srcShowHeight = srcHeight;  
   
             if (srcShowWidth >= destWidth && srcShowHeight >= destHeight) {  
                 Image image = bi.getScaledInstance(srcShowWidth, srcShowHeight, Image.SCALE_DEFAULT);//获取缩放后的图片大小    
                 cropFilter = new CropImageFilter(x, y, destWidth, destHeight);  
                 img = Toolkit.getDefaultToolkit().createImage(new FilteredImageSource(image.getSource(), cropFilter));  
                 BufferedImage tag = new BufferedImage(destWidth, destHeight, BufferedImage.TYPE_INT_RGB);  
                 Graphics g = tag.getGraphics();  
                 g.drawImage(img, 0, 0, null); // 绘制截取后的图    
                 g.dispose();  
   
                 String ext = FilenameUtils.getExtension(srcImageFile);  
   
                 path += HEADER_PIC;  
                 User loginUser = SystemUtil.getLoginUser(request.getSession());  
                 String fileName = loginUser.getName() + "." + ext;  
                 File destImageFile = new File(path + "/" + fileName);  
                 // 输出为文件    
                 ImageIO.write(tag, ext, destImageFile);  
   
                 loginUser.setPicPath(SystemConst.SYSTEM_CONTEXT_PATH_VALUE + HEADER_PIC + "/" + fileName);  
                 userService.update(loginUser);  
                 // 删除原临时文件  
                 srcFile.delete();  
   
                 GeneralMessage msg = new GeneralMessage();  
                 msg.setCode(GeneralMessage.SUCCESS);  
                 msg.setMsg("上传成功！");  
                 return msg;  
             }  
         } catch (Exception e) {  
             e.printStackTrace();  
         }  
         return null;  
     }  

4.Android+struts2实现文件图片上传，附源码（侧重服务端开发）

前言

项目中遇到Android手机聊天的图片、语音文件保存到服务器，网上搜索一下大概3种思路：

1.servlet实现，有很多文章，利用DiskFileUpload

2.使用smartupload未学习

3.利用strtus2自带的文件上传功能。

由于strtus2已广泛应用与企业应用，且上手较快，学习成本低、配置简单。文件上传功能已封装，简单易用，故毫不犹豫选择他。

网上这方面的资料不少，但很多重复的，且比较乱，新手可能很难找到自己想要的。总算自己捣鼓半天完成了功能，整理做下笔记，供大家参考。最后附上源码

Android客户端

[java]  view plain copy print ?   
     
    
 //要用到三个东东来做Post：HttpClient，httpPost，MultipartEntity  
 HttpClient httpClient = new DefaultHttpClient();   
   
         httpClient.getParams().setParameter( CoreProtocolPNames.PROTOCOL_VERSION, HttpVersion.HTTP_1_1 );  
   
         HttpPost httpPost = new HttpPost( "http://localhost:8680/upload/chat/uploadFile" );  
   
         MultipartEntity postEntity = new MultipartEntity();  
   
         // 字符用StringBody  
         String fileName = "2.jpg";  
   
         ContentBody cbFileName;  
           
         cbFileName = new StringBody( fileName );  
   
         // 文件用FileBody，并指定文件类型  
               
         File file = new File( "D:\\FTP\\2.jpg");  
         ContentBody cbFileData = new FileBody( file, "image/jpg" );  
   
   
         // 把上面创建的这些Body全部加到Entity里面去。  
         // 注意他们的key，这些key在Struts2服务器端Action的代码里必须保持一致！！  
         postEntity.addPart( "fileName", cbFileName );  
         postEntity.addPart( "fileData", cbFileData );  
   
         httpPost.setEntity( postEntity );  
         // 下面这句话就把数据提交到服务器去了  
         HttpResponse response = httpClient.execute( httpPost );  

服务端struts2

配置web.xml、引入相应jar包、等本文不展开论述，

struts.xml配置

[html]  view plain copy print ?   
     
    
 <package name="chat" namespace="/chat" extends="struts-default">  
         <action name="uploadFile" class="com.tch.action.FileUploadAction" method="upload">  
         </action>  
     </package>  

贴上Action类

[java]  view plain copy print ?   
     
    
 // 注意这些变量名，看见了没？ 和Struts2的FormBean是一样的。  
     // 要和客户端添加字段时的关键字保持一致！！  
     private String fileName = null;  
     private String fileData = null;  
     //针对每个字段的关键字，下面的这些Set方法必须一个不少，否则你什么也得不到  
     public void setFileName(String fileName) {  
         this.fileName = fileName;  
     }  
     public void setFileData(String fileData) {  
         this.fileData = fileData;  
     }  

[java]  view plain copy print ?   
     
    
 public String upload()  
     {  
         String webappPath = findServerPath();  
           
         //path=D:\apache-tomcat-6.0.36\webapps\dqapi\  
         //String path = ServletActionContext.getServletContext().getRealPath("/");  
         //appPath=/dqapi  
         //String appPath = ServletActionContext.getServletContext().getContextPath();  
         String chatFile_path = ServletActionContext.getServletContext().getInitParameter("UPLOAD_CHAT_FILE_PATH");  
         FileCopyUtil util = new FileCopyUtil();  
         String[] array = fileName.split("\\.");  
         String fileType = array[array.length-1];  
           
         //String destDir = path.replace(appPath, chatFile_path);  
         String destDir = webappPath + chatFile_path;  
         //先获取HttpServletResponse  
         HttpServletResponse response = (HttpServletResponse) ActionContext.getContext().get( ServletActionContext.HTTP_RESPONSE );  
   
         //打开数据流，把要给客户端返回的数据写进数据流  
         OutputStream writer = null;  
   
         ......  
           
         // 这里不用再返回其他字符串了。  
         // 客户端接收的不是这里返回的数据，这个是显示结果网页才会用到的返回值。  
   
         return null;  
   
     }  

将用户上传文件与web项目本身分离

项目路径D:\apache-tomcat-6.0.36\webapps\upload

保存上传的文件到webapps目录下指定位置

文件拷贝代码如下

[java]  view plain copy print ?   
     
    
 public String copyFile(String fileType,String fileData,String destDir) throws IOException  
     {  
         Date date = new Date();  
         String dirName = new SimpleDateFormat("yyyyMMdd").format(date);  
         String newFileName = new SimpleDateFormat("yyyyMMddHHmmss_SSS").format(date);&nbs

你可能感兴趣的:(异步上传文件)

探索 Spring Boot 异步任务：解锁高效并发处理的密码疯狂的键盘侠 java spring boot spring boot 后端 java
探索SpringBoot异步任务：解锁高效并发处理的密码在当今快节奏的数字化时代，Web应用面临着海量并发请求的严苛挑战。传统同步处理模式常使系统陷入阻塞泥沼，响应迟缓，资源闲置浪费。SpringBoot异步任务机制宛如一把利刃，划破效率瓶颈，助力应用在高并发浪潮中轻盈起舞，飞速响应，实现资源的极致利用。一、SpringBoot异步任务核心探秘SpringBoot依托Java强大的并发编程能力，将
C# StreamReader/StreamWriter 使用详解鲤籽鲲 C#c#开发语言
总目录前言在C#开发中，StreamReader和StreamWriter是处理文本文件的核心类，属于System.IO命名空间。它们基于流（Stream）操作文本数据，支持读写、编码设置、异步操作等，适用于日志记录、配置文件处理、数据导出等场景。本文将从基础到高级用法，结合代码示例，全面解析其核心功能、性能优化及常见问题解决方案。一、什么是StreamReader和StreamWriter？1.
Unity开放世界实时GI分块烘焙策略技术详解 Clank的游戏栈 unity 游戏引擎
一、开放世界光照挑战与分块方案1.超大场景光照的核心痛点单次烘焙不可行：256km²场景的完整烘焙需数周计算时间内存压力：单张8K光照贴图占用128MB（BC7压缩）动态更新需求：昼夜循环、天气系统需要局部重烘焙2.分块策略设计graphTBA[世界网格划分]-->B[9宫格加载区]B-->C[动态加载卸载]C-->D[异步烘焙队列]D-->E[边缘过渡处理]分块类型尺寸建议光照贴图分辨率加载半径
React（10）一路向前的月光 react.js 前端前端框架
项目实践--创建项目在store的modules中创建相关的子仓库暴露到仓库index文件中导入creatSlice和axios创建仓库和数据的异步修改方法//编写store//导入createSlice和axiosimport{createSlice}from"@reduxjs/toolkit";importaxiosfrom"axios";//创建sliceconstfoodsStore=cr
Redis主从复制的问题总结 DP成长之路面试 Mysql基础
读写分离的问题1.数据复制的延迟读写分离时，master会异步的将数据复制到slave，如果这是slave发生阻塞，则会延迟master数据的写命令，造成数据不一致的情况解决方法：可以对slave的偏移量值进行监控，如果发现某台slave的偏移量有问题，则将数据读取操作切换到master，但本身这个监控开销比较高，所以关于这个问题，大部分的情况是可以直接使用而不去考虑的。2.读到过期的数据我们知道
JAVA BIO、NIO、AIO详解（附代码实现）以及Netty的简介诺浅其他 BIO NIO AIO IO Netty
缘起NIO基本是面试过程中必问专题，很有了解的必要。Java中的三种IO模式BIO：同步堵塞NIO：同步非堵塞IO，JDK1.4提出AIO：异步非堵塞，在JDK1.7中才被提出在JAVA中，IO分两块，一块是操作文件的，一块是操作网络的。本文主要对操作网络的这一块进行说明网络IO首先我们要明白的是，所谓Nio，Aio的提出，都只是为了加快服务器端的处理能力的，而非客户端。为了能够通俗的理解BIO,
QT开发：事件循环与处理机制的概念和流程概括性总结 m0_74825074 qt 开发语言
事件循环与处理机制的概念和流程Qt事件循环和事件处理机制是Qt框架的核心，负责管理和分发各种事件（用户交互、定时器事件、网络事件等）。以下是详细透彻的概念解释和流程讲解。1.事件循环（EventLoop）的概念事件循环是一个无限循环，它从操作系统或其他事件源获取事件，并将其分发给应用程序中的对象进行处理。事件循环确保应用程序能够不断地响应用户输入和其他异步事件。在Qt中，QCoreApplicat
flink常用参数及介绍 dgbcf flink 大数据数据库
Table和SQLAPI的配置参数，Hints的用法执行配置选项参数介绍table.exec.async-lookup.buffer-capacity异步查找连接可以触发的异步i/o操作的最大数量。table.exec.async-lookup.timeout异步操作完成的异步超时。table.exec.disabled-operators主要用于测试。以逗号分隔的运算符名称列表，每个名称代表一种
Redis主从复制原理及注意事项鸨哥学JAVA 数据库 java 服务器
主从复制特点主从复制，是指将一台Redis服务器的数据，复制到其他的Redis服务器。前者称为主节点(master)，后者称为从节点(slave),数据的复制是单向的，只能由主节点到从节点.具有以下特点：1.异步复制,从2.8版本开始的。2.允许单个master配置多个slave3.允许master->slave->slave模式4.master在进行replication时是非阻塞的，在repl
Vue Router 导航守卫中 next({ ...to, replace: true }) 的深入解析有诺千金 Vue3 vue.js javascript 前端
引言在Vue项目中，权限控制是常见需求之一。例如，不同角色的用户（如管理员和普通用户）需要访问不同的页面。通过动态路由和导航守卫的结合，可以实现灵活的权限控制。然而，动态添加路由时，异步操作的时序问题可能导致导航失败。此时，next({...to,replace:true})作为一种高效的解决方案，可以确保路由正确加载并避免历史记录重复。本文将深入解析这一写法的语法、原理及实际应用。一、导航守卫与
HTTPX: 青出于蓝,比肩requests的新生代网络请求库 zzzzls~ 爬虫网络 python http 爬虫
作为新生代的网络请求库，HTTPX不仅支持requests的所有操作，同时支持异步API及HTTP/2。根据官网的描述，总结有如下特点：标准的同步接口及异步支持HTTP/1.1和HTTP/2直接向WSGI/ASGI应用程序发出请求严格的超时设置全类型注释100%测试覆盖率文章目录快速开始安装基本使用发起请求传递参数响应重定向超时进阶Client用法共享配置合并配置EventhooksHttppro
【HTML+CSS】使用HTML与后端技术连接数据库 m0_74823264 面试学习路线阿里巴巴 html css 数据库
目录一、概述1.1HTML前端1.2后端技术1.3数据库二、HTML表单示例三、PHP后端示例3.1连接数据库3.2接收数据并插入数据库四、安全性4.1防止SQL注入4.2数据验证与清洗五、优化5.1索引优化5.2查询优化六、现代Web开发中的最佳实践6.1使用ORM（对象关系映射）6.2前后端分离6.3异步通信（AJAX/FetchAPI）七、结论在Web开发中，经常需要从前端（HTML/CSS
第12章:优化并发_《C++性能优化指南》notes 郭涤生性能优化 c/c++c++性能优化算法笔记
优化并发一、并发基础与优化核心知识点二、关键代码示例与测试三、关键优化策略总结四、性能测试方法论多选题设计题答案与详解多选题答案：设计题答案示例一、并发基础与优化核心知识点线程vs异步任务核心区别：std::thread直接管理线程，std::async由运行时决定异步策略（可能用线程池）。优化点：频繁创建线程开销大，优先用std::async。原子操作与内存序原子类型：std::atomic确保
红宝书第十七讲：通俗详解JavaScript的Promise与链式调用前端javascript
红宝书第十七讲：通俗详解JavaScript的Promise与链式调用资料取自《JavaScript高级程序设计（第5版）》。查看总目录：红宝书学习大纲一、Promise的作用：解决“回调地狱”的困境Promise（承诺）是JavaScript管理异步操作的工具，用于替代传统的嵌套回调链（回调地狱）。它能将异步代码线性化，让异步逻辑像步骤说明书一样清晰12。传统回调地狱的代码（难以阅读和维护）：/
红宝书第十六讲：通俗详解JavaScript回调函数与事件循环前端javascript
红宝书第十六讲：通俗详解JavaScript回调函数与事件循环资料取自《JavaScript高级程序设计（第5版）》。查看总目录：红宝书学习大纲一、回调函数：任务的“代金券”回调函数是将一个函数作为参数传递给另一个函数，在特定条件满足时自动触发执行的机制。例如：用户点击按钮时触发函数、异步请求完成时处理数据1。示例：DOM事件回调//点击按钮时触发回调函数constbutton=document.
Vue 单个文件拆分组件，异步组件使用总结 86Eric VUE vue.js vue拆分组件异步组件提升性能
拆分组件Vue项目中，是否将单个文件内的功能拆分成多个小组件，取决于多个因素，代码复杂度、可维护性、复用性以及性能等。以下是一些判断标准和拆分的好处，帮助您决定是否需要拆分。1.是否需要拆分的判断标准代码复杂度如果单个文件内的代码量很大（例如超过300行），逻辑复杂，建议拆分成小组件。拆分后，每个组件只关注自己的功能，代码更清晰，易于理解和维护。功能独立性如果文件内的某些功能是独立的（例如一个表单
vue3(笔记)5.0--pinia工具的知识扩展不断努力的根号七 vue3 笔记
pinia工具defineStore(创建pinia)作用：用于定义一个Piniastore。用法：接收一个唯一的ID和一个配置对象，配置对象中可以定义state、getters和actions。state是一个函数，返回初始状态。getters类似于Vue组件中的计算属性，用于派生状态。actions用于修改状态和执行异步操作。示例代码：import{defineStore}from'pinia
通过AOP技术拦截Spring Boot中异步方法执行，并动态调整线程池的线程数以应对不同任务的需求翱翔-蓝天 spring boot java 后端
在SpringBoot项目中，结合AOP（面向切面编程）和异步方法（@Async），实现动态调整线程池线程数的能力，能够提升系统应对不同业务场景下异步任务处理的灵活性和稳定性。下面是完整的实现思路和代码示例，详细说明如何通过AOP拦截@Async异步方法，并根据业务需求动态调整线程池参数。✅实现目标通过AOP拦截@Async方法调用动态调整线程池配置参数（如核心线程数、最大线程数等）根据不同业务任
在 Dojo 框架中define、declare 和 require的区别 lzfshub java 前端 linux
0.dojo库引入在Dojo框架中，define、declare和require是三个重要的概念，它们在模块化和类声明中扮演不同的角色。以下将详细介绍它们的功能、区别及使用场景：1.define定义：define用于定义一个模块（module），它是Dojo模块化开发的核心方法。用途：创建独立的代码块，便于管理和复用。声明模块的依赖关系，通过回调函数实现模块间的交互。支持异步加载，优化页面加载性能
Vue.js 源码解析：响应式系统的依赖收集与触发机制码上前端 vue.js 前端框架前端 javascript watch vue3.js
前言：家人们，大家好！今天分享一篇文章给大家！要是文章对你有帮助，激发了你的灵感，求个收藏+关注啦～后续还有超多惊喜，别错过！目录一、响应式系统核心概念二、依赖收集过程1.数据劫持实现2.依赖收集流程三、更新触发机制1.同步更新队列2.异步更新优化四、深度响应式实现五、循环引用处理六、性能优化策略七、与Vue2的对比优化八、实战应用建议九、未来发展方向一、响应式系统核心概念Vue.js的响应式系统
[Qt5] QMetaObject::invokeMethod使用丶布布 #GUI ◎QT5 qt 开发语言
博客主页：https://loewen.blog.csdn.net欢迎点赞收藏⭐留言如有错误敬请指正！本文由丶布布原创，首发于CSDN，转载注明出处现在的付出，都会是一种沉淀，只为让你成为更好的人✨文章预览：一.前言二.作用三.使用场景一.前言QMetaObject::invokeMethod结合Qt::QueuedConnection的作用是实现跨线程安全调用或异步执行方法。其核心目的是确保方法
前端请求全面解析：AJAX、Axios 与 Fetch 的使用详解与代码示例 weixin_535033321 前端 ajax javascript
前端请求全面解析：AJAX、Axios与Fetch的使用详解与代码示例前端请求全面解析：AJAX、Axios与Fetch的使用详解与代码示例1.AJAX——传统的异步请求1.1基本用法示例1.2AJAX特点2.FetchAPI——现代化请求方案2.1基本用法示例2.2Fetch特点3.Axios——第三方HTTP请求库3.1安装Axios3.2基本用法示例3.3Axios特点4.总结前端请求全面解
C++多线程知识点总结 Null_Bug_Null C++语法知识点总结 c++开发语言算法
C++多线程知识点总结相比C++98，C++11提供了很多的全新的完备的特性，其中一项重要支持就是语言本身正式支持了多线程。本文将较为全面地简要介绍一下C++11中多线程相关库。总的来说，C++提供了两套多线程技术相关的类库：以线程类为代表的标准线程库，包括：thread类、锁mutex、原子变量atomic等以异步执行为目标的异步执行库，包括：future、promise、packaged_ta
FileConverterFactory实现Retrofit下载文件直接返回File (三) 大渔歌_ Android retrofit
最近在研究Retrofit下载文件,之前也写了两篇关于Retrofit下载上传文件以及下载上传进度的监听的问题.Retrofit上传/下载文件和Retrofit上传/下载文件扩展实现进度的监听.使用之中发现还是不是很方便.于是在想能不能想GsonConverterFactory那样自定义一个FileConverterFactory在响应回调中直接返回File呢?想到就做,于是写了一个FileCon
Spring Boot集成Spring Cloud Stream实现消息驱动微服务微赚淘客系统开发者@聚娃科技 spring boot 微服务后端
SpringBoot集成SpringCloudStream实现消息驱动微服务大家好，我是微赚淘客返利系统3.0的小编，是个冬天不穿秋裤，天冷也要风度的程序猿！在构建微服务架构时，消息驱动的微服务是一种常见的设计模式。SpringCloudStream提供了一种简单而强大的模型来发送和接收消息，从而实现解耦和异步处理。SpringCloudStream简介SpringCloudStream是用于构建
RocketMQ 详细知识点总结翱翔-蓝天 java开发实战 rocketmq
RocketMQ详细知识点总结1.核心概念1.1基础组件Producer（生产者）消息的发送者支持同步、异步和单向发送方式提供事务消息功能Consumer（消费者）消息的接收者支持Push和Pull两种消费模式支持集群消费和广播消费NameServer（命名服务）路由注册中心无状态节点，可集群部署提供轻量级服务发现和路由Broker（消息服务器）消息存储和转发支持主从架构提供消息存储、投递和查询功
深入理解 JavaScript 的 `async/await` 写完这行代码打球去 #js javascript 开发语言 ecmascript
async/await是JavaScript中处理异步操作的重要工具，它建立在Promise的基础之上，并且与Promise的API完全兼容。本文将从基础概念、优势以及底层原理等多个角度，带你全面了解async/await。什么是async/await？async/await是generator函数的语法糖，它让异步代码的书写更加直观，接近同步代码的风格。async的作用声明异步函数：通过asyn
Unity网络开发快速回顾托塔1 Unity知识快速回顾 unity 网络游戏引擎
知识点来源：总结人间自有韬哥在，唐老狮，豆包目录1.网络通信-通信必备知识-IP地址和端口类2.网络通信中序列化和反序列化2进制数据3.Socket类4.TCP同步服务端和客户端基础实现4.1.服务端基本实现4.2.客户端实现：5.区分消息类型6.分包和粘包7.TCP同步退出消息和心跳消息7.1.客服端主动断开连接7.2.心跳消息8.Socket类TCP异步常用成员9.UDP10.Socket类U
react中 useEffect和useLayoutEffect的区别阿丽塔~ react.js 前端前端框架
useEffect和useLayoutEffect都是React中用于处理副作用的Hook，但它们在执行时机和用途上有一些关键区别。理解这些区别可以帮助你更好地选择适合的Hook来实现特定的功能。1.执行时机useEffect：异步执行：useEffect是在组件渲染完成后，浏览器完成重绘（repaint）之后异步执行的。这意味着它不会阻塞浏览器的渲染过程，因此不会影响用户体验。适合非布局相关的副
uniapp中APP上传文件 @听雨声 uni-app
uniapp提供了uni.chooseImage（选择图片），uni.chooseVideo（选择视频）这两个api，但是对于打包成APP的话就没有上传文件的api了。因此我采用了plus.android中的方式来打开手机的文件管理从而上传文件。下面是我封装的APP端选择上传图片，视频，文件的一个上传组件。{{item.name}}×上传{{getUploadTypeText()}}-->{{ti
java观察者模式 3213213333332132 java 设计模式游戏观察者模式
观察者模式——顾名思义，就是一个对象观察另一个对象，当被观察的对象发生变化时，观察者也会跟着变化。在日常中，我们配java环境变量时，设置一个JAVAHOME变量,这就是被观察者，使用了JAVAHOME变量的对象都是观察者，一旦JAVAHOME的路径改动，其他的也会跟着改动。这样的例子很多，我想用小时候玩的老鹰捉小鸡游戏来简单的描绘观察者模式。老鹰会变成观察者，母鸡和小鸡是
TFS RESTful API 模拟上传测试 ronin47
TFS RESTful API 模拟上传测试。　　细节参看这里：https://github.com/alibaba/nginx-tfs/blob/master/TFS_RESTful_API.markdown 模拟POST上传一个图片： curl --data-binary @/opt/tfs.png http
PHP常用设计模式单例, 工厂, 观察者, 责任链, 装饰, 策略,适配,桥接模式 dcj3sjt126com 设计模式 PHP
// 多态, 在JAVA中是这样用的, 其实在PHP当中可以自然消除, 因为参数是动态的, 你传什么过来都可以, 不限制类型, 直接调用类的方法 abstract class Tiger { public abstract function climb(); } class XTiger extends Tiger { public function climb()
hibernate 171815164 Hibernate
main,save Configuration conf =new Configuration().configure(); SessionFactory sf=conf.buildSessionFactory(); Session sess=sf.openSession(); Transaction tx=sess.beginTransaction(); News a=new
Ant实例分析 g21121 ant
下面是一个Ant构建文件的实例，通过这个实例我们可以很清楚的理顺构建一个项目的顺序及依赖关系，从而编写出更加合理的构建文件。下面是build.xml的代码： <?xml version="1
[简单]工作记录_接口返回405原因 53873039oycg 工作
最近调接口时候一直报错，错误信息是: responseCode:405 responseMsg:Method Not Allowed 接口请求方式Post.
关于java.lang.ClassNotFoundException 和 java.lang.NoClassDefFoundError 的区别程序员是怎么炼成的
真正完成类的加载工作是通过调用 defineClass来实现的；而启动类的加载过程是通过调用 loadClass来实现的；就是类加载器分为加载和定义 protected Class<?> findClass(String name) throws ClassNotFoundExcept
JDBC学习笔记-JDBC详细的操作流程 aijuans jdbc
所有的JDBC应用程序都具有下面的基本流程：　　1、加载数据库驱动并建立到数据库的连接。　　2、执行SQL语句。　　3、处理结果。　　4、从数据库断开连接释放资源。下面我们就来仔细看一看每一个步骤：其实按照上面所说每个阶段都可得单独拿出来写成一个独立的类方法文件。共别的应用来调用。 1、加载数据库驱动并建立到数据库的连接： Html代码 St
rome创建rss antonyup_2006 tomcat cms xml struts Opera
引用 1.RSS标准 RSS标准比较混乱，主要有以下3个系列 RSS 0.9x / 2.0 : RSS技术诞生于1999年的网景公司(Netscape)，其发布了一个0.9版本的规范。2001年，RSS技术标准的发展工作被Userland Software公司的戴夫温那(Dave Winer)所接手。陆续发布了0.9x的系列版本。当W3C小组发布RSS 1.0后，Dave W
html表格和表单基础百合不是茶 html 表格表单 meta 锚点
第一次用html来写东西,感觉压力山大,每次看见别人发的都是比较牛逼的再看看自己什么都还不会, html是一种标记语言,其实很简单都是固定的格式 _----------------------------------------表格和表单表格是html的重要组成部分,表格用在body里面的主要用法如下; <table> &
ibatis如何传入完整的sql语句 bijian1013 java sql ibatis
ibatis如何传入完整的sql语句？进一步说，String str ="select * from test_table"，我想把str传入ibatis中执行，是传递整条sql语句。解决办法： <
精通Oracle10编程SQL(14)开发动态SQL bijian1013 oracle 数据库 plsql
/* *开发动态SQL */ --使用EXECUTE IMMEDIATE处理DDL操作 CREATE OR REPLACE PROCEDURE drop_table(table_name varchar2) is sql_statement varchar2(100); begin sql_statement:='DROP TABLE '||table_name;
【Linux命令】Linux工作中常用命令 bit1129 linux命令
不断的总结工作中常用的Linux命令 1.查看端口被哪个进程占用通过这个命令可以得到占用8085端口的进程号，然后通过ps -ef|grep 进程号得到进程的详细信息 netstat -anp | grep 8085 察看进程ID对应的进程占用的端口号 netstat -anp | grep 进程ID &
优秀网站和文档收集白糖_ 网站
集成 Flex, Spring, Hibernate 构建应用程序性能测试工具-JMeter Hmtl5-IOCN网站 Oracle精简版教程网站鸟哥的linux私房菜 Jetty中文文档 50个jquery必备代码片段 swfobject.js检测flash版本号工具
angular.extend boyitech AngularJS angular.extend AngularJS API
angular.extend 复制src对象中的属性去dst对象中. 支持多个src对象. 如果你不想改变一个对象，你可以把dst设为空对象{}: var object = angular.extend({}, object1, object2). 注意: angular.extend不支持递归复制. 使用方法: angular.extend(dst, src); 参数:
java-谷歌面试题-设计方便提取中数的数据结构 bylijinnan java
网上找了一下这道题的解答，但都是提供思路，没有提供具体实现。其中使用大小堆这个思路看似简单，但实现起来要考虑很多。以下分别用排序数组和大小堆来实现。使用大小堆： import java.util.Arrays; public class MedianInHeap { /** * 题目：设计方便提取中数的数据结构 * 设计一个数据结构，其中包含两个函数，1.插
ajaxFileUpload 针对 ie jquery 1.7+不能使用问题修复版本 Chen.H ajaxFileUpload ie6 ie7 ie8 ie9
jQuery.extend({ handleError: function( s, xhr, status, e ) { // If a local callback was specified, fire it if ( s.error ) { s.error.call( s.context || s, xhr, status, e ); }
[机器人制造原则]机器人的电池和存储器必须可以替换 comsci 制造
机器人的身体随时随地可能被外来力量所破坏,但是如果机器人的存储器和电池可以更换,那么这个机器人的思维和记忆力就可以保存下来,即使身体受到伤害,在把存储器取下来安装到一个新的身体上之后,原有的性格和能力都可以继续维持..... 另外,如果一
Oracle Multitable INSERT 的用法 daizj oracle
转载Oracle笔记-Multitable INSERT 的用法 http://blog.chinaunix.net/uid-8504518-id-3310531.html 一、Insert基础用法语法： Insert Into 表名 (字段1,字段2,字段3...） Values (值1,
专访黑客历史学家George Dyson datamachine on
20世纪最具威力的两项发明——核弹和计算机出自同一时代、同一群年青人。可是，与大名鼎鼎的曼哈顿计划（第二次世界大战中美国原子弹研究计划）相比，计算机的起源显得默默无闻。出身计算机世家的历史学家George Dyson在其新书《图灵大教堂》（Turing’s Cathedral）中讲述了阿兰·图灵、约翰·冯·诺依曼等一帮子天才小子创造计算机及预见计算机未来
小学6年级英语单词背诵第一课 dcj3sjt126com english word
always 总是 rice 水稻，米饭 before 在...之前 live 生活，居住 usual 通常的 early 早的 begin 开始 month 月份 year 年 last 最后的 east 东方的 high 高的 far 远的 window 窗户 world 世界 than 比...更
在线IT教育和在线IT高端教育 dcj3sjt126com 教育
codecademy http://www.codecademy.com codeschool https://www.codeschool.com teamtreehouse http://teamtreehouse.com lynda http://www.lynda.com/ Coursera https://www.coursera.
Struts2 xml校验框架所定义的校验文件蕃薯耀 Struts2 xml校验 Struts2 xml校验框架 Struts2校验
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 蕃薯耀 2015年7月11日 15:54:59 星期六 http://fa
mac下安装rar和unrar命令 hanqunfeng mac
1.下载：http://www.rarlab.com/download.htm 选择 RAR 5.21 for Mac OS X 2.解压下载后的文件 tar -zxvf rarosx-5.2.1.tar 3.cd rar sudo install -c -o $USER unrar /bin #输入当前用户登录密码 sudo install -c -o $USER rar
三种将list转换为map的方法 jackyrong list
在本文中，介绍三种将list转换为map的方法： 1）传统方法假设有某个类如下 class Movie { private Integer rank; private String description; public Movie(Integer rank, String des
年轻程序员需要学习的5大经验 lampcy 工作 PHP 程序员
在过去的7年半时间里，我带过的软件实习生超过一打，也看到过数以百计的学生和毕业生的档案。我发现很多事情他们都需要学习。或许你会说，我说的不就是某种特定的技术、算法、数学，或者其他特定形式的知识吗？没错，这的确是需要学习的，但却并不是最重要的事情。他们需要学习的最重要的东西是“自我规范”。这些规范就是：尽可能地写出最简洁的代码；如果代码后期会因为改动而变得凌乱不堪就得重构；尽量删除没用的代码，并添加
评“女孩遭野蛮引产致终身不育 60万赔偿款1分未得”医腐深入骨髓 nannan408
先来看南方网的一则报道：再正常不过的结婚、生子，对于29岁的郑畅来说，却是一个永远也无法实现的梦想。从2010年到2015年，从24岁到29岁，一张张新旧不一的诊断书记录了她病情的同时，也清晰地记下了她人生的悲哀。　　粗暴手术让人发寒　　2010年7月，在酒店做服务员的郑畅发现自己怀孕了，可男朋友却联系不上。在没有和家人商量的情况下，她决定堕胎。　　12月5日，
使用jQuery为input输入框绑定回车键事件 VS 为a标签绑定click事件 Everyday都不同 jsp input 回车键绑定 click enter
假设如题所示的事件为同一个，必须先把该js函数抽离出来，该函数定义了监听的处理： function search() { //监听函数略...... } 为input框绑定回车事件，当用户在文本框中输入搜索关键字时，按回车键，即可触发search(): //回车绑定 $(".search").keydown(fun
EXT学习记录 tntxia ext
1. 准备（1）官网：http://www.sencha.com/ 里面有源代码和API文档下载。 EXT的域名已经从www.extjs.com改成了www.sencha.com ，但extjs这个域名会自动转到sencha上。（2）帮助文档：想要查看EXT的官方文档的话，可以去这里h
mybatis3的mapper文件报Referenced file contains errors xingguangsixian mybatis
最近使用mybatis.3.1.0时无意中碰到一个问题： The errors below were detected when validating the file "mybatis-3-mapper.dtd" via the file "account-mapper.xml". In most cases these errors can be d