zoukankan      html  css  js  c++  java
  • Uploadify v3.2.1 上传图片并预览

    前端JSP:

    <script type="text/javascript">
    			  
    			$(function() {
    			    $("#upload_org_code").uploadify({
    			    	'height'        : 27, 
    			    	'width'         : 80,  
    			    	'buttonText'    : '选择图片',
    			        'swf'           : '${pageContext.request.contextPath}/js/uploadify/uploadify.swf',
    			        'uploader'      : '${pageContext.request.contextPath}/uploadIMGSerlet',
    			        'auto'          : true,
    			        'multi'         : false,
    			        'removeCompleted':false,
    			        'cancelImg'     : '${pageContext.request.contextPath}/js/uploadify/uploadify-cancel.png',
    			        'fileTypeExts'  : '*.jpg;*.jpge;*.gif;*.png',
    			        'fileSizeLimit' : '2MB',
    			        'onUploadSuccess':function(file,data,response){
    			        	$('#' + file.id).find('.data').html('');
    			        	$("#upload_org_code_name").val(data);
    			        	$("#upload_org_code_img").attr("src","${pageContext.request.contextPath}/getImg?file="+data);	
    			        	$("#upload_org_code_img").show();
    			        },
    			        //加上此句会重写onSelectError方法【需要重写的事件】
    			      	'overrideEvents': ['onSelectError', 'onDialogClose'],
    			        //返回一个错误,选择文件的时候触发
    			        'onSelectError':function(file, errorCode, errorMsg){
    			            switch(errorCode) {
    			                case -110:
    			                    alert("文件 ["+file.name+"] 大小超出系统限制的" + jQuery('#upload_org_code').uploadify('settings', 'fileSizeLimit') + "大小!");
    			                    break;
    			                case -120:
    			                    alert("文件 ["+file.name+"] 大小异常!");
    			                    break;
    			                case -130:
    			                    alert("文件 ["+file.name+"] 类型不正确!");
    			                    break;
    			            }
    			        },
    			    });
    		
    </script>
    

      

                <tr>
                            <td align="right"><font style="color: red;">*</font>组织代码机构:</td>
                            <td>
                            	<table>
                            		<tr>
                            			<td width="45%"><input type="file" name="upload_org_code" id="upload_org_code"/></td>
                            			<td><img style="display: none" id="upload_org_code_img" src="" width="150" height="150"></td>
                            		</tr>
                            	</table>
    	                        <input type="hidden" name="upload_org_code_name" id="upload_org_code_name" />
    	                        <hr>
                            </td>
                        </tr>
    

      

    后端servlet:

    package com.mybank.enterprise.framework.servlet;
    
    import java.io.File;
    import java.io.FileOutputStream;
    import java.io.IOException;
    import java.io.InputStream;
    import java.io.OutputStream;
    import java.io.PrintWriter;
    import java.util.Iterator;
    import java.util.List;
    
    import javax.servlet.ServletException;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    
    import org.apache.commons.fileupload.FileItem;
    import org.apache.commons.fileupload.FileUploadException;
    import org.apache.commons.fileupload.disk.DiskFileItemFactory;
    import org.apache.commons.fileupload.servlet.ServletFileUpload;
    
    import com.mybank.enterprise.util.Constant;
    import com.mybank.enterprise.util.StringUtil;
    
    public class UploadIMGSerlet extends HttpServlet {
    
    
    	private static final long serialVersionUID = 1L;
    
    	// 上传文件的保存路径
    	private String configPath = Constant.RB.getString("img_path");
    	// 临时文件路径
    	private String dirTemp = "resource/temp/";
    
    	public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    		this.doPost(request, response);
    	}
    
    	public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    		
    		String ret_fileName = null;//返回给前端已修改的图片名称
    
    		request.setCharacterEncoding("UTF-8");
    		response.setContentType("text/html; charset=UTF-8");
    		PrintWriter out = response.getWriter();
    
    		// 文件保存目录路径
    		String savePath = configPath;
    
    		// 临时文件目录
    		String tempPath = this.getServletContext().getRealPath("/") + dirTemp;
    
    		// 创建文件夹
    		File dirFile = new File(savePath);
    		if (!dirFile.exists()) {
    			dirFile.mkdirs();
    		}
    
    		// 创建临时文件夹
    		File dirTempFile = new File(tempPath);
    		if (!dirTempFile.exists()) {
    			dirTempFile.mkdirs();
    		}
    
    		DiskFileItemFactory factory = new DiskFileItemFactory();
    		factory.setSizeThreshold(20 * 1024 * 1024); // 设定使用内存超过5M时,将产生临时文件并存储于临时目录中。
    		factory.setRepository(new File(tempPath));  // 设定存储临时文件的目录。
    
    		ServletFileUpload upload = new ServletFileUpload(factory);
    		upload.setHeaderEncoding("UTF-8");
    
    		try {
    			List<?> items = upload.parseRequest(request);
    			Iterator<?> itr = items.iterator();
    
    			while (itr.hasNext()) {
    				FileItem item   = (FileItem) itr.next();
    				String fileName = item.getName();
    				if(fileName!=null){
    					String endstr = fileName.substring(fileName.indexOf("."),fileName.length());
    					fileName      = StringUtil.createSerial20().concat(endstr);
    					ret_fileName  = fileName;
    				}
    				if (!item.isFormField()) {
    
    					try {
    						File uploadedFile = new File(savePath,fileName);
    
    						OutputStream os = new FileOutputStream(uploadedFile);
    						InputStream is = item.getInputStream();
    						byte buf[] = new byte[1024];// 可以修改 1024 以提高读取速度
    						int length = 0;
    						while ((length = is.read(buf)) > 0) {
    							os.write(buf, 0, length);
    						}
    						// 关闭流
    						os.flush();
    						os.close();
    						is.close();
    					} catch (Exception e) {
    						e.printStackTrace();
    					}
    				}
    			}
    
    		} catch (FileUploadException e) {
    			e.printStackTrace();
    		}
    		//将已修改的图片名称返回前端
    		out.print(ret_fileName);
    		out.flush();
    		out.close();
    	}
    
    }
    

      

    package com.mybank.enterprise.framework.servlet;
    
    import java.io.File;
    import java.io.FileInputStream;
    import java.io.IOException;
    import java.io.OutputStream;
    
    import javax.servlet.ServletException;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    
    import com.mybank.enterprise.util.Constant;
    
    public class GetIMGServlet extends HttpServlet {
    	
    	private static final long serialVersionUID = 2761789171087122738L;
    
    	public void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
    
    		this.doPost(req, resp);
    	}
    
    	@Override
    	protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
    
    		String file = req.getParameter("file");
    		
    		File pic = new File(Constant.RB.getString("img_path")+file);
    
    		FileInputStream fis = new FileInputStream(pic);
    		OutputStream os = resp.getOutputStream();
    		try {
    			int count = 0;
    			byte[] buffer = new byte[1024 * 1024];
    			while ((count = fis.read(buffer)) != -1)
    				os.write(buffer, 0, count);
    			os.flush();
    		} catch (IOException e) {
    			e.printStackTrace();
    		} finally {
    			if (os != null)
    				os.close();
    			if (fis != null)
    				fis.close();
    		}
    		
    	}
    
    }
    

      

  • 相关阅读:
    文本框的正则表达式验证
    八皇后问题 回溯法
    Repeater中使用倒计时
    c#导入excel 绑定数据 repeat为例子
    "table" is not mapped 解决方法
    NHibernate的常见问题及解决方案
    Nginx日志切割,跨域配置,防盗链配置
    springboot跨域配置
    图片上传,文件url地址添加时间戳,防止浏览器缓存的情况
    使用Hibernate数据验证
  • 原文地址:https://www.cnblogs.com/yangy608/p/3915337.html
Copyright © 2011-2022 走看看