基于HTML5+js+Java实现单文件文件上传到服务器功能

上传单文件到服务器

应公司要求，在HTML5页面上实现上传文件到服务器，对于一个还没毕业的实习生菜鸟来说，这可不得了-----不会，网上各种百度，找各种博客还是没解决，最后还是请教了公司的大神，人家给卸了一个例子，然后根据人家写的终于把这个上传文件搞定。

好了，开始上代码。

HTML5代码：

 <form name="upform" action="" method="POST">  
          <input type ="file" name="myfile1" id="myfile1"/><br/>  
          <input type ="file" name="myfile2" id="myfile2"/><br/> 
              备注：<input type="text" name="mydata" id="mydata"/><br/> 
          <input type="button" value="确定" onclick="upload()"/><br/>  
</form>

js代码：

FormData可以把它理解成一个虚拟的表单对象，它只有一个方法append，我们可以通过append向FormData里面添加各种需要提交的数据。

url：/adata/adata/payment/PaymentAction/upload.menu----指的是你Java接受信息的action路径

_pathName=/adata//payment.jsp-----------指的是你HTML5页面的虚拟路径。

alert(result);-------指的是从Java后台返回的信息。

function upload() { 
 mydata = document.getElementById("mydata").files[0]; 
 formData = new FormData(); 
 formData.append("mydata", mydata); 
  $.ajax({ 
       contentType:"multipart/form-data", 
       url:"/adata/adata/payment/PaymentAction/upload.menu?_pathName=/adata//payment.jsp", 
       type:"POST", 
       data:formData, 
       dataType:"text", 
       processData: false, // 告诉jQuery不要去处理发送的数据 
       contentType: false, // 告诉jQuery不要去设置Content-Type请求头 
       success: function(result){ 
       alert(result); 
 } 
 }); 
}

Java代码：

String savePath = "d:/";//存储路径 
      String retMsg = "";//定义将返回给客户端的信息 
      try { 
        if (ServletFileUpload.isMultipartContent(request)) { 
          List<FileItem> items = new ServletFileUpload(new DiskFileItemFactory()).parseRequest(request); 
          for (FileItem item : items) { 
            if (!item.isFormField()) {// 过滤掉表单中非文件域 
              String fileType = item.getName().substring(item.getName().lastIndexOf(".") + 1).toLowerCase();//文件类型 
              String fileName = new Date().getTime() + "." + fileType; //保存的文件名 
              String filePath = savePath + "\\" + fileName; //保存的文件路径 
              BufferedInputStream in = new BufferedInputStream(item.getInputStream());// 获得文件输入流 
              BufferedOutputStream out = new BufferedOutputStream(new FileOutputStream(new File(filePath)));// 获得文件输出流 
              org.apache.commons.fileupload.util.Streams.copy(in, out, true);// 开始把文件写到指定的上传文件夹 
              retMsg += "上传文件成功！"; 
              in.close(); 
              out.close(); 
            }  
          } 
        } 
        response.setContentType("text/html;charset=utf8"); 
        PrintWriter pw = response.getWriter(); 
        pw.print(retMsg); 
        pw.flush(); 
        pw.close(); 
        //根据自己需要返回页面一个 retMsg
　　　　　　　　　//　return retMsg 证明上传成功
      } catch (Exception e) { 
        e.printStackTrace(); 
      }

总结

以上所述是小编给大家介绍的基于HTML5+js+Java实现单文件文件上传到服务器功能，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：notice#nhooo.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

基础教程