1. 全栈程序员必看首页

plupload+struts2实现文件上传下载「建议收藏」

全栈程序员-用户IM • • 未分类

plupload+struts2实现文件上传下载

大家好，又见面了，我是全栈君。

    plupload是一款优秀的web前端上传框架。使用简单。功能强大。不仅支持文件多上传，进度条。拖拽方式选择文件更重要的是他会自己主动的识别浏览器来选择最合适的上传方式。废话少说先上图：plupload+struts2实现文件上传下载「建议收藏」

代码都是測试过的非常好用，仅仅要把jquery路径和版本号改动下面，去plupload官网把jar把下载下来就能够用了。

先看一下uploadUI.jsp源码。uploadUI.jsp就是上图显示的页面：

<%@ page language=”java” import=”java.util.*” pageEncoding=”UTF-8″%>
<%@ taglib prefix=”s” uri=”/struts-tags” %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+”://”+request.getServerName()+”:”+request.getServerPort()+path+”/”;
%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv=”content-type” content=”text/html; charset=UTF-8″/>
<title>Plupload上传页面</title>
<script type=”text/javascript” src=”jquery/jquery-2.1.4.min.js”></script>
<script type=”text/javascript” src=”plupload/plupload.full.min.js”></script>
<script type=”text/javascript” src=”plupload/jquery.ui.plupload/jquery.ui.plupload.js”></script>
<script type=”text/javascript” src=”js/pop.js”></script>
<style type=”text/css”>
    html{
     width:100%;
     height:100%;
-webkit-text-size-adjust:none;
-moz-text-size-adjust:none;
-ms-text-size-adjust:none;
-o-text-size-adjust:none;
text-size-adjust:none; 
     }
     /**
     *进度条样式
     */
   #processbar {
    height:20px;
    width: 60%;
    margin-top:15px;
    margin-left:65px;
    background-color:#C7D6E4;
    border: 0px solid #999;
    border-radius:15px;
    }
   .finish {
    height: 20px;
    width:60%;
    background-color:#5CB85C;
    border-radius:15px;
   }
   td{  
     width:200px;  
     height:16px;
     text-align: center;
      }  
</style>
</head>
<body style=”font:13px Verdana; background:#eee;color:#333;width:99%”>
<br/>
<div id=”container” style=”margin-left:-9px;width:100%;height:600px;background-color:#EBEBEB;border:1px solid #EBEBEB;”>
       <div id=”pickfiles” style=”background-color:#abcdef;width:100%;height:45px;margin-top:-24px;”>
         <span style=”font-size:25px;font-family:fantasy;font-weight:bold”>文件上传</span>
         　　　　　　　　<span style=”font-size:15px;font-family:fantasy;text-align:bottom”>点击选择文件或拖拽文件至下方空白区</span>
       </div> 
   <div id=”drag” style=”width:100%;height:300px;background-color:#ffffff;border:1px solid #EBEBEB;overflow-y:auto;”>
        <table id=”filesTable” style=”font-size:14px;margin:0 auto;width:100%;cellpadding=0;cellspacing=0;word-break:break-all; border-collapse: collapse;”> 
           <tr>
              <th>文件名</th><th>文件大小</th><th>进度</th><th>删除</th>
           </tr>
        </table>
   </div>
   <div>
    <button id=”uploadfiles”>開始上传</button>
    <button id=”stopUploadfiles” >停止上传</button>
    <input type=”hidden” id=”filename” name=”filename”>
    <input type=”hidden” id=”filesize” name=”filesize”>
   </div>
</div>
<br/>
<pre id=”console”></pre>
<script type=”text/javascript”>
var newFlagFlag=true;
window.onload = function () {
var uploader = new plupload.Uploader({
runtimes : ‘html5,flash,silverlight,html4’,//plupload会在文件上传时依据浏览器的不停选择合适的上传方式
browse_button : ‘pickfiles’,//选择文件的按钮  
container:’container’,//文件上传容器  
url:’file_upload.action’,//上传文件路径  
flash_swf_url:’plupload/Moxie.swf’,// Flash环境路径设置  
silverlight_xap_url:’plupload/Moxie.xap’,//silverlight环境路径设置  
unique_names :true,//生成唯一文件名称  
resize: {   //能够使用该參数对将要上传的图片进行压缩
 width: 100, //指定压缩后图片的宽度。假设没有设置该属性则默觉得原始图片的宽度
 height: 100,//指定压缩后图片的高度，假设没有设置该属性则默觉得原始图片的高度
 crop: true,//是否裁剪图片
 quality: 60,//压缩后图片的质量，仅仅对jpg格式的图片有效，默觉得90
 preserve_headers: false  //压缩后是否保留图片的元数据，true为保留
},
    multipart:true,//为true时将以multipart/form-data的形式来上传文件，为false时则以二进制的格式来上传文件
    multi_selection:true,//能否够在文件浏览对话框中选择多个文件，true为能够，false为不能够。默认true
    file_data_name:’file’, //name=’file’
    max_retries:5,//当发生plupload.HTTP_ERROR错误时的重试次数，为0时表示不重试
    drop_element:’drag’,
filters : [{
title : ‘全部’,  //文件上产过滤器。我这里是全部文件都能够上传
         extensions : ‘*’ 
}],
init: {//当Plupload初始化完毕后触发   监听函数參数：(uploader plupload的实例对象)
PostInit: function() {
document.getElementById(‘uploadfiles’).onclick = function() {//開始上传方法
uploader.start();
return false;
};
document.getElementById(‘stopUploadfiles’).onclick = function() {//停止上传方法
uploader.stop();
return false;
};
},
FilesAdded: function(up, files){//当文件加入到上传队列后触发 
 plupload.each(files, function(file){
$(“#filesTable”).append(“<tr><td class=” + file.id + “>” + file.name + “</td><td>”+plupload.formatSize(file.size)+”</td>”+
“<td id=” +file.id +”><div id=’processbar’><div class=’finish’ id=’div_contianer”+file.id+”‘ style=’visibility:hidden;’></div></div></td>”+
   “<td><input type=’button’ id=” +file.id +” value=’删除’></input></td>”+
“</tr>”);
});
},
OptionChanged:function(up,option_name,new_value,old_value){//当使用Plupload实例的setOption()方法改变当前配置參数后触发 

},
UploadProgress: function(up, file){  //上传过程中触发  能够用此事件来显示上传进度
//在这写加入进度条
$(“#div_contianer”+file.id).css(“width”,file.percent+”%”);
$(“#div_contianer”+file.id).text(file.percent+”%”);
},
BeforeUpload:function(up, file){  //当队列中的某一个文件正要開始上传前触发 
document.getElementById(“div_contianer”+file.id).style.visibility=’visible’;
},
UploadFile:function(up, file){ //当上传队列中某一个文件開始上传后触发 
$(“#filename”).val(file.name);
$(“#filesize”).val(file.size);
},
StateChanged:function(up){ //当上传队列的状态发生改变时触发 

},
QueueChanged:function(up){ //当上传队列发生变化后触发，即上传队列新增了文件或移除了文件。

QueueChanged事件会比FilesAdded或FilesRemoved事件先触发 

},
FilesRemoved:function(up, files){ //当文件从上传队列移除后触发 
             
          return false;
},
ChunkUploaded:function(up,file,responseObject){ //当使用文件小片上传功能时，每个小片上传完毕后触发 

},
UploadComplete:function(up,files){ //当上传队列中全部文件都上传完毕后触发  files为一个数组，里面的元素为本次已完毕上传的全部文件对象
    alert(files[0].name);
},
Error: function(up, err) {
document.getElementById(‘console’).innerHTML += “\nError #” + err.code + “: ” + err.message;
}
}
});
uploader.init();
};
</script>
<a href=”file_downloadFile.action?filepath=D:\uploadFiles\gaode.txt”>点击下载文件</a>
</body>
</html>

在看一下struts.xml文件：

<?xml version=”1.0″ encoding=”UTF-8″ ?

>
<!DOCTYPE struts PUBLIC
“-//Apache Software Foundation//DTD Struts Configuration 2.0//EN”
“http://struts.apache.org/dtds/struts-2.0.dtd”>
<struts>

    <constant name=”struts.enable.DynamicMethodInvocation” value=”true” />
    <constant name=”struts.devMode” value=”false” />
    <!– 错误信息国际化 –>
    <constant name=”struts.custom.i18n.resources” value=”file”></constant>
    <!– 上传文件最大限制是100M –>
    <constant name=”struts.multipart.maxSize” value=”209715200″ />
    <constant name=”struts.action.extension” value=”action” /><!– struts2的默认路径后缀名是.action –>
    <package name=”default” namespace=”/” extends=”struts-default”>
    
         <!– 文件action –>
         <action name=”file_*” class=”com.uploadanddownload.action.FileAction” method=”{1}”>
           <interceptor-ref name=”fileUpload”>
             <!– 配置同意上传的文件类型 –>
              <param name=”allowedTypes”>
                image/jpeg,image/gif,image/png,image/bmp,
                text/css,application/msword,application/octet-stream,text/html,
                application/x-javascript,text/plain,application/zip,application/x-zip-compressed,
                video/x-msvideo,application/msword,
                audio/mpeg,application/pdf,application/vnd.ms-powerpoint,application/excel,
                application/vnd.ms-excel,text/xml,application/xlsx,application/vnd.ms-excel.sheet.macroEnabled.12,
                application/java-archive,
                 application/vnd.ms-excel,application/xlsx,application/vnd.ms-excel.sheet.macroEnabled.12,
                application/java-archive,application/x-cdf,application/x-netcdf,application/x-cpio,application/x-csh,
                application/x-dvi,message/rfc822,text/x-setext,application/x-gtar,application/x-hdf,
                image/ief,application/x-latex,video/mpeg,application/x-troff-man,application/x-troff-me,message/rfc822,
                message/rfc822,application/x-mif,video/quicktime,video/x-sgi-movie,video/mpeg,application/x-troff-ms,
                application/x-netcdf,message/rfc822,application/oda,application/x-pkcs12,application/pkcs7-mime,image/x-portable-bitmap,
                application/x-pkcs12,image/x-portable-graymap,image/x-portable-anymap,application/vnd.ms-powerpoint,
                image/x-portable-pixmap,text/x-python,application/x-python-code,audio/x-pn-realaudio,application/x-pn-realaudio,image/x-cmu-raster,
                image/x-rgb,text/richtext,text/x-sgml,application/x-sh,application/x-shar,application/x-wais-source,application/x-sv4cpio,application/x-sv4crc,
                application/x-shockwave-flash,application/x-troff,application/x-tar,application/x-tcl,application/x-tex,application/x-texinfo,image/tiff,application/x-troff,
                text/tab-separated-values,application/x-ustar,text/x-vcard,audio/x-wav,image/x-xbitmap,application/xml,image/x-xpixmap,image/x-xwindowdump,
                application/kset,application/ksdps,application/kswps,
                application/vnd.openxmlformats-officedocument.wordprocessingml.document,
                application/vnd.openxmlformats-officedocument.presentationml.presentation,
                application/vnd.openxmlformats-officedocument.spreadsheetml.sheet
              </param>
             <!– 配置同意上传文件的大小(单位字节) 2M–>
           </interceptor-ref>
           
            <!– 下载配置 –>
            <result type=”stream”>  <!– 这个是文件下载的写法 –>
               <param name=”contentType”>application/octet-stream;charset=ISO8859-1 </param>  
               <param name=”inputName”>inStream</param>  
               <param name=”contentDisposition”>attachment;filename=”${filename}”</param>  
            </result>  
            <interceptor-ref name=”defaultStack”></interceptor-ref><!– 把struts2的默认拦截器写在result的后边 –>
         </action>
    </package>
</struts>

最后是FileAction中的代码，这个action包括了上传和下载方法，支持不同浏览器下载文件名称乱码等问题：

package com.uploadanddownload.action;

import java.io.ByteArrayInputStream;
import java.io.File;
import java.io.FileInputStream;
import java.io.IOException;
import java.io.InputStream;
import java.net.URLEncoder;
import javax.servlet.ServletContext;
import org.apache.commons.io.FileUtils;
import org.apache.struts2.ServletActionContext;
import Decoder.BASE64Encoder;
import com.opensymphony.xwork2.ActionSupport;
/**
 * 文件action  
 * @author LEZ
 *2015年5月12日
 */
 public class FileAction extends ActionSupport{
    //序列化id  实现序列化接口时定义的序列化id。反序列化的时候能够依据这个id又一次生成对象
 private static final long serialVersionUID = -8036172233915538118L;
 private File file;   //上传时从页面传过来的文件
 private String fileContentType;    //文件类型  
 private String fileFileName;    //文件名称    
 private String filename;    //下载所用文件名称    
 private ServletContext context;   //上下文环境
 private String mimeType;    //下载的类型转换
 private InputStream inStream;   //输入流  下载必须用
 private String filesize;
 private int fileId;
 private String filepath;//文件路径
 public String getFilepath() {
return filepath;
}
public void setFilepath(String filepath) {
this.filepath =filepath;
}
private String inputCon;//详细输入的条件
public int getFileId() {
return fileId;
}
public void setFileId(int fileId) { 
this.fileId = fileId;
}
public String getFilesize() {
return filesize;
}
public String getInputCon() {
return inputCon;
}
public void setInputCon(String inputCon) {
this.inputCon = inputCon;
}
public void setFilesize(String filesize) {
this.filesize = filesize;
}
 /**
   * 下载方法
   * author:lez
   * 2015年5月19日 下午1:33:21
   */
   public String downloadFile(){  
   return SUCCESS;  
}
   
    public File getFile(){
 return file;
    }
    public String getFileContentType(){
  return fileContentType;
    }
    public String getFileFileName() {
return fileFileName;
}
  //为client提供输入流
    public InputStream getInStream(){
   try {
  File file = new File(filepath);
      inStream = new FileInputStream(file);   
     if (inStream == null) {  
       inStream = new ByteArrayInputStream(“Sorry,File not found !”.getBytes());  
    }  
   } catch (Exception e) {
   e.printStackTrace();
   }
  return inStream;  
    }
    //依据不同的文件动态给出MIME文件类型
    public String getContentType(){
        //在Tomcat Conf里的web.xml有相应的映射文件
        return ServletActionContext.getServletContext().getMimeType(filename);
    }
    //返回一个文件名称
    public String getFilename() throws IOException{
        String agent=ServletActionContext.getRequest().getHeader(“user-agent”);//依据http头信息获取相应的浏览器类型
        return encodeDownloadFilename(filename,agent);
    }
    //下载附件名乱码问题 ， IE和火狐 解决不同   IE默认是Url编码 火狐默认是base64编码
    public String encodeDownloadFilename(String filename, String agent)
            throws IOException {
        if (agent.contains(“Firefox”)) { // 火狐浏览器
            filename = “=?UTF-8?B?”
                    + new BASE64Encoder().encode(filename.getBytes(“utf-8”))
                    + “?=”;
        } else { // IE及其它浏览器
            filename = URLEncoder.encode(filename, “utf-8”);
        }
       return filename;
    }
    public String getMimeType() {  
 return mimeType;  
 }
public void setFile(File file){
this.file = file;
    }
  public void setFileContentType(String fileContentType){
this.fileContentType = fileContentType;
}  
  public void setFileFileName(String fileFileName) {
 try {
this.fileFileName =fileFileName;
} catch (Exception e) {
e.printStackTrace();
}
}  
public void setFilename(String filename) {
this.filename = filename;
}
  public void setServletContext(ServletContext context) {  
     this.context = context;  
   }  
/**
 * 上传文件方法
 * @return
 */
   public String upload(){
  System.out.println(“进入上传”);
   try{  
       File file = new File(“D:/uploadFiles”);    
          if(!file.exists()){    
              file.mkdirs();     
           }  
           //文件拷贝  
           FileUtils.copyFile(this.file,new File(file,this.fileFileName));  
        }catch(Exception e){  
        e.printStackTrace();  
        }  
   return null;
   }
}

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。

发布者：全栈程序员-用户IM，转载请注明出处：https://javaforall.cn/116295.html原文链接：https://javaforall.cn

【正版授权，激活自己账号】： Jetbrains全家桶Ide使用，1年售后保障，每天仅需1毛

【官方授权 正版激活】： 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

赞 (0)
全栈程序员-用户IM全栈程序员-用户IM
0 0
blank

相关推荐

  • mongodb 唯一索引 性能_什么是唯一索引

    mongodb 唯一索引 性能_什么是唯一索引

    mongodb 唯一索引 性能_什么是唯一索引MongoDB支持的索引种类很多，诸如单键索引，复合索引，多键索引，TTL索引，文本索引，空间地理索引等。同时索引的属性可以具有唯一性，即唯一索引。唯一索引用于确保索引字段不存储重复的值，即强制索引字段的唯一性。缺省情况下，MongoDB的_id字段在创建集合的时候会自动创建一个唯一索引。本文主要描述唯一索引的用法。

    全栈程序员-用户IM 全栈程序员-用户IM
    2022年9月20日
  • java工程师面试题及答案_实施工程师面试问题

    java工程师面试题及答案_实施工程师面试问题

    java工程师面试题及答案_实施工程师面试问题内容涵盖：Java、MyBatis、ZooKeeper、Dubbo、Elasticsearch、Memcached、Linux等技术栈。

    全栈程序员-用户IM 全栈程序员-用户IM
    2022年10月15日
  • origin如何绘制双y轴柱状图_Graphpad柱状图双Y轴

    origin如何绘制双y轴柱状图_Graphpad柱状图双Y轴

    origin如何绘制双y轴柱状图_Graphpad柱状图双Y轴origin横坐标的标注如何修改成双行显示呢？shift+enter，可以换行思路：在两个图层上分别绘制两个柱状图，然后将两个图层合并。第一步：建立一个X列，四个Y列。其中，两列数据中间加上两个空列第二步：绘制第一个柱状图第三步：绘制第二个柱状图第四步：两图层合并点击合并按钮第五步：接下来就是坐标轴的显示基本上就完成了…

    全栈程序员-用户IM 全栈程序员-用户IM
    2022年9月30日
  • mysql 分区总结[通俗易懂]

    mysql 分区总结[通俗易懂]

    mysql 分区总结[通俗易懂]目录简介mysql分区类型分区语法创建表与分区分区表的管理操作mysql分区表的局限性使用分区优化查询性能如何看使用到了分区可以直接指定表的分区来查询在where语句中对分区字段进行大小的限制简介数据库分区数据库分区是一种物理数据库设计技术。虽然分区技术可以实现很多效果，但其主要目的是为了在特定的SQL操作中减少数据读写的总量以缩减sq…

    全栈程序员-用户IM 全栈程序员-用户IM
    2022年5月27日
  • spring源码搭建_springmvc常用5种注解

    spring源码搭建_springmvc常用5种注解

    spring源码搭建_springmvc常用5种注解1、Spring源码下载第一步：https://github.com/spring-projects/spring-framework从git上面下载Spring的源码第二步：下载http://services.gradle.org/distributions/(笔者采用的是4.7版本)第三步：解压gradle-4.7-all.zip,配置GRADLE_HOME和PathGRADLE_HOME…

    全栈程序员-用户IM 全栈程序员-用户IM
    2022年8月12日
  • vim中保存退出_文档没保存就关了怎么恢复

    vim中保存退出_文档没保存就关了怎么恢复

    vim中保存退出_文档没保存就关了怎么恢复保存命令按ESC键跳到命令模式，然后：:w保存文件但不退出vi:wfile将修改另外保存到file中，不退出vi:w!强制保存，不推出vi:wq保存文件并退出vi:wq!强制保存文件，并退出viq:不保存文件，退出vi:q!不保存文件，强制退出vi:e!放弃所有修改，从上次保存文件开始再编辑

    全栈程序员-用户IM 全栈程序员-用户IM
    2022年8月24日

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号