码迷,mamicode.com
首页 > 其他好文 > 详细

上传图片

时间:2014-08-11 17:22:22      阅读:425      评论:0      收藏:0      [点我收藏+]

标签:des   style   blog   http   color   java   os   io   

  1 <%@page language="java" pageEncoding="utf-8"%>
  2 <%@include file="../../base/pagePublic.jsp"%>
  3 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
  4 <%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
  5 <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
  6 <html>
  7 <head>
  8 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  9 <script type="text/javascript" src="/MoblieManager/controls/editor/fckeditor.js"></script>
 10 <script type="text/javascript" src="/MoblieManager/css/js/swfobject.js"></script>
 11 
 12 <script src="/MoblieManager/css/js/jquery.form.js" type="text/javascript"></script>
 13 <title>商户企业信息修改</title>
 14 </head>
 15 <link href="/MoblieManager/css/page/css/css.css" rel="stylesheet" type="text/css" />
 16 <link rel="stylesheet" type="text/css" href="/MoblieManager/css/table/img/dialog.js"/>
 17 <link rel="stylesheet" type="text/css" href="/MoblieManager/css/table/img/base.css"/>
 18 <link rel="stylesheet" type="text/css" href="/MoblieManager/css/table/img/style.css"/>
 19 <link rel="stylesheet" type="text/css" href="/MoblieManager/css/table/img/indexbody.css"/>
 20 <script>
 21 window.onload = function()
 22 {
 23     var thumb01 =document.getElementById("pic1").value;    
 24     if(thumb01!=""&&thumb01!="null"){
 25        document.getElementById("imgpic01").src =thumb01;
 26     }
 27     var thumb02 =document.getElementById("pic2").value;    
 28     if(thumb02!=""&&thumb02!="null"){
 29        document.getElementById("imgpic02").src =thumb02;
 30     }
 31     var thumb03 =document.getElementById("pic3").value;    
 32     
 33     if(thumb03!=""&&thumb03!="null"){
 34        document.getElementById("imgpic03").src =thumb03;
 35     }
 36     var thumb04 =document.getElementById("pic4").value;    
 37     if(thumb04!=""&&thumb04!="null"){
 38        document.getElementById("imgpic04").src =thumb04;
 39     }
 40     
 41     
 42     var thumb05 =document.getElementById("pic5").value;    
 43     if(thumb05!=""&&thumb05!="null"){
 44        document.getElementById("imgpic05").src =thumb05;
 45     }
 46     var thumb06 =document.getElementById("pic6").value;    
 47     if(thumb06!=""&&thumb06!="null"){
 48        document.getElementById("imgpic06").src =thumb06;
 49     }
 50     
 51 }; 
 52 
 53 function droppic(memberid,picname,picid){
 54     if(confirm("确定要删除吗?")){
 55         var url = "/MoblieManager/forms/company/deletecompanyPic";
 56         var dataStr = {"memberid":" + memberid + ","picname":"+picname+"};
 57         var data = $.parseJSON(dataStr);
 58         $.ajax({type: "POST", url:url, data:data, success:function(json){
 59             if(json.result==1){
 60                 alert("操作成功");
 61                 document.getElementById(picid).value="";
 62                 window.location.reload();
 63             }else{
 64                 alert("操作失败");
 65             }
 66         }})
 67     }
 68 }
 69 
 70 //修改企业信息
 71 function edit() {    
 72     if(validateForm($("form"))){
 73         alert("修改成功!");
 74         $("form")[0].submit();        
 75     }
 76 }    
 77 
 78 
 79 //上传
 80 //===================
 81 var html = "<div class=‘mine_con_1‘ > "+
 82 "<table cellpadding=‘0‘ cellspacing=‘0‘ class=‘title_table1‘width=‘100%‘>"+
 83    "<tr>"+
 84        "<td class=‘td_1‘>上传图片:</td>"+
 85        "<td class=‘td_2‘>"+
 86            "<input type=‘file‘ name=‘file‘ />"+
 87            "<input type=‘button‘ value=‘upload‘ onclick=‘javascript:uploadfile(this);‘ />"+
 88         "</td>"+
 89    "</tr>"+
 90 "</table>"+ 
 91 "</div>";
 92 //上传
 93 var picnum=01;
 94 function upload(pic){
 95     picnum = pic;    
 96     MessageBoxx(null, 上传图片, html);    
 97 }
 98 function MessageBoxx(ev,title,content)
 99 {    
100 var objPos = {x:200, y:100}; 
101 messContent="<div style=‘padding:20px 0 20px 0;text-align:center‘>"+content+"</div>"; 
102 showMessageBox(title,messContent,objPos,550); 
103 }
104 
105 //上传主程序
106 function uploadfile(o) {
107   //准备显示的图片(不能在这里创建,否者ie图片不能根据height按比例缩小)
108   //var img = document.createElement("img");
109   //img.title = "双击图片可删除图片";
110   //img.height = "100";
111 
112   var self = $(o);
113   if (!self) { return; }
114   //self:上传按钮;    
115   var parentDiv = self.parent(); //整个上传的容器    
116   var imgDiv = parentDiv.find(".fileimgdiv").eq(0); //用于显示图片的div
117   var imgupfile = parentDiv.find("input:file").eq(0); //上传控件
118   var span = imgupfile.parent(); //上传按钮的父级。
119   var ImageHideFile = parentDiv.find("input:hidden").eq(0); //图片隐藏域。
120   if (imgupfile.val() == "") {
121       alert("请选择要上传的图片!");
122       return false;
123   }
124   else {
125       if (!checkImgType(imgupfile.val())) {
126           alert("格式不正确,只能上传格式为gif|jpeg|jpg|png|bmp!");
127           return false;
128       }
129   }
130 
131 
132   //准备表当
133   var myform = document.createElement("form");
134   myform.action = "/MoblieManager/forms/upload/picUpload";
135   myform.method = "post";
136   myform.enctype = "multipart/form-data";
137   myform.style.display = "none";
138   //将表单加当document上,
139   document.body.appendChild(myform);  //创建表单后一定要加上这句否则得到的form不能上传。document后要加上body,否则火狐下不行。
140   var form = $(myform);
141   //var fu = imgupfile.clone(true).val(""); //先备份自身,用于提交成功后,再次附加到span中。
142   var fu1 = imgupfile.appendTo(form); //然后将自身加到form中。此时form中已经有了file元素。
143 
144   //将上传等待图标附加到span此时,span中只用这个等待的图片(上传控件self不在了)。
145   //span.html("<img src=\"/images/loading.gif\" />   正在上传..  ");
146   
147   form.ajaxSubmit({
148       //dataType: ‘json‘,
149       success: function (data) {
150           //alert(data);
151           if(data.code=="0"){
152               alert("上传成功");
153             document.getElementById("pic"+picnum).value =data.filePath;
154               document.getElementById("imgpic0"+picnum).src =data.filePath; 
155             closeWindow();
156           }else{
157               alert(data.errMsg);
158               closeWindow();
159           }
160           
161       }
162   }); 
163 }
164 
165 
166 //检查上传的图片格式
167 function checkImgType(filename) {
168   var pos = filename.lastIndexOf(".");
169   var str = filename.substring(pos, filename.length)
170   var str1 = str.toLowerCase();
171   if (!/\.(gif|jpg|jpeg|png|bmp)$/.test(str1)) {
172       return false;
173   }
174   return true;
175 }
176 
177 
178 
179         
180 </script>
181 <body style="border:1px sload red;">
182       <div class="mine_con_1">
183           <form name="company" action="/MoblieManager/forms/company/updateCompany" method="post">    
184                 <table cellpadding="0" cellspacing="0" class="title_table1"width="100%">  
185                     <tr>
186                     <td class="td_1" style="width:10%">企业ID:</td>
187                     <td class="td_2" style="width:100%">${company.companypkid }</td>
188                     </tr>
189                     <tr>
190                     <td class="td_1" style="width:10%">企业名称:</td>
191                     <td class="td_2" style="width:150%"><input type="text" class="input_Name" validate="notNull" desc="企业名称" name="companyname" id="companyname" value="${company.companyname }" maxlength="60"/><font color="red">*</font></td>
192                     </tr>
193                     <tr>
194                     <td class="td_1" style="width:10%">企业法人:</td>
195                     <td class="td_2" style="width:100%"><input type="text" class="input_Name" validate="notNull" desc="企业法人" name="taxnumthumb" id="taxnumthumb" value="${company.taxnumthumb }" maxlength="30"/><font color="red">*</font></td>
196                     </tr>
197                     <tr>
198                     <td class="td_1" style="width:10%">营业执照编号:</td>
199                     <td class="td_2" style="width:100%"><input type="text" class="input_Name" validate="notNull" desc="营业执照编号" name="paypwd" id="paypwd" value="${company.paypwd }" maxlength="100"/><font color="red">*</font></td>
200                     </tr>
201                     <tr>
202                     <td class="td_1" style="width:10%">组织机构代码:</td>
203                     <td class="td_2" style="width:100%"><input type="text" class="input_Name" validate="notNull" desc="组织机构代码" name="finafiled" id="finafiled" value="${company.finafiled }" maxlength="60"/><font color="red">*</font></td>
204                     </tr>
205                     <tr>
206                     <td class="td_1" style="width:10%">税务登记号:</td>
207                     <td class="td_2" style="width:100%"><input type="text" class="input_Name" validate="notNull" desc="税务登记号" name="account" id="account" value="${company.account }" maxlength="60"/><font color="red">*</font></td>
208                     </tr>
209                     <tr>
210                     <td class="td_1" style="width:10%">主营行业:</td>
211                     <td class="td_2" style="width:150%"><input type="text" class="input_Name" validate="notNull" desc="主营行业" name="busilicecsethumb" id="busilicecsethumb" value="${company.busilicecsethumb }" maxlength="200"/><font color="red">*</font></td>
212                     </tr>
213                     <tr>
214                     <td class="td_1" style="width:10%">经营模式:</td>
215                     <td class="td_2" style="width:150%"><input type="text" class="input_Name" validate="notNull" desc="经营模式" name="tradetype" id="tradetype" value="${company.tradetype }" maxlength="200"/><font color="red">*</font></td>
216                     </tr>
217                     <tr>
218                     <td class="td_1" style="width:10%">联系电话:</td>
219                     <td class="td_2" style="width:100%"><input type="text" class="input_Name" validate="notNull" desc="联系电话" name="linkphone" id="linkphone" value="${company.linkphone }" maxlength="30"/><font color="red">*</font></td>
220                     </tr>
221                     <tr>
222                     <td class="td_1" style="width:10%">注册地址:</td>
223                     <td class="td_2" style="width:100%">
224                     <input type="text" class="input_Name" validate="notNull" desc="省份" name="registerProvinceid" id="registerProvinceid" value="${company.registerProvinceid }" maxlength="100"/>
225                     <input type="text" class="input_Name" validate="notNull" desc="市" name="registerCityid" id="registerCityid" value="${company.registerCityid }" maxlength="100"/>
226                     <input type="text" class="input_Name" validate="notNull" desc="区" name="registerAreaid" id="registerAreaid" value="${company.registerAreaid }" maxlength="100"/>
227                     <input type="text" class="input_Name" validate="notNull" desc="街道" name="registerAddress" id="registerAddress" value="${company.registerAddress }" maxlength="300"/>
228                     </td>
229                     </tr>
230                     
231                     <tr>
232                     <td class="td_1" style="width:10%">营业地址:</td>
233                     <td class="td_2" style="width:100%">
234                     <input type="text" class="input_Name" validate="notNull" desc="省份" name="businessProvinceid" id="businessProvinceid" value="${company.businessProvinceid }" maxlength="100"/>
235                     <input type="text" class="input_Name" validate="notNull" desc="市" name="businessCityid" id="businessCityid" value="${company.businessCityid }" maxlength="100"/>
236                     <input type="text" class="input_Name" validate="notNull" desc="区" name="businessAreaid" id="businessAreaid" value="${company.businessAreaid }" maxlength="100"/>
237                     <input type="text" class="input_Name" validate="notNull" desc="街道" name="businessAddress" id="businessAddress" value="${company.businessAddress }" maxlength="300"/>
238                     </td>
239                     </tr>
240                     
241                     <tr>
242                         <td class="td_1">上传缩略图:</td>
243                         <td class="td_2">
244                             <input type="button" onclick="upload(1)" value="身份证正面照片" style="margin-left: 100px"/>
245                             <input type="hidden" name="idfontpic" id="pic1" value="${company.idfontpic }">
246                             <input type="button" onclick="upload(2)" value="身份证反面照片" style="margin-left: 300px"/>
247                             <input type="hidden" name="idbackpic" id="pic2" value="${company.idbackpic }">
248                         </td>
249                     </tr>
250                     <tr>
251                         <td class="td_1">&nbsp;</td>
252                         <td class="td_2">
253                         <img src="/MoblieManager/css/images/pic_no.png"  width="340" height="210" alt="" id="imgpic01" onclick="droppic(‘${company.memberid}‘,‘idfontpic‘,‘pic1‘)"/>
254                         <img src="/MoblieManager/css/images/pic_no.png"  width="340" height="210" alt="" id="imgpic02" onclick="droppic(‘${company.memberid}‘,‘idbackpic‘,‘pic2‘)" style="margin-left: 60px"/>
255                         </td>
256                     </tr>
257                     
258                     <tr>
259                         <td class="td_1">上传缩略图:</td>
260                         <td class="td_2">
261                             <input type="button" onclick="upload(3)" value="本人持身份证照片" style="margin-left: 100px" />
262                             <input type="hidden" name="personidpic" id="pic3" value="${company.personidpic }">
263                             <input type="button" onclick="upload(4)" value="本人与店铺合影" style="margin-left: 290px"/>
264                             <input type="hidden" name="personshoppic" id="pic4" value="${company.personshoppic }">
265                         </td>
266                     </tr>
267                     <tr>
268                         <td class="td_1">&nbsp;</td>
269                         <td class="td_2">
270                         <img src="/MoblieManager/css/images/pic_no.png"  width="340" height="210" alt="" id="imgpic03" onclick="droppic(‘${company.memberid}‘,‘personidpic‘,‘pic3‘)"/>
271                         <img src="/MoblieManager/css/images/pic_no.png"  width="340" height="210" alt="" id="imgpic04" onclick="droppic(‘${company.memberid}‘,‘personshoppic‘,‘pic4‘)" style="margin-left: 60px"/>
272                         </td>
273                     </tr>
274                     
275                     <tr>
276                         <td class="td_1">上传缩略图:</td>
277                         <td class="td_2">
278                             <input type="button" onclick="upload(5)" value="营业执照照片" style="margin-left: 100px"/>
279                             <input type="hidden" name="busilicecse" id="pic5" value="${company.busilicecse }">
280                             <input type="button" onclick="upload(6)" value="店铺门帘照片" style="margin-left: 295px"/>
281                             <input type="hidden" name="shoppic" id="pic6" value="${company.shoppic }">
282                         </td>
283                     </tr>
284                     <tr>
285                         <td class="td_1">&nbsp;</td>
286                         <td class="td_2">
287                         <img src="/MoblieManager/css/images/pic_no.png"  width="340" height="210" alt="" id="imgpic05" onclick="droppic(‘${company.memberid}‘,‘busilicecse‘,‘pic5‘)"/>
288                         <img src="/MoblieManager/css/images/pic_no.png"  width="340" height="210" alt="" id="imgpic06" onclick="droppic(‘${company.memberid}‘,‘shoppic‘,‘pic6‘)" style="margin-left: 60px"/>
289                         </td>
290                     </tr>
291                     
292                     <tr>
293                         <td class="td_2" colspan="2" style="text-align:center;">
294                             <input type="hidden" name="memberid" value="${company.memberid }"/>
295                             <input type="button" class="btn" onclick="edit()" value="确定"/>
296                             <input type="button" onclick="history.back()" class="btn" value="返回">
297                         </td>
298                     </tr>
299                 </table>
300             </form>
301     </div>
302 </body>
303 </html>

//后台处理上传:
private
Logger log = LogManager.getLogger(UploadController.class); @RequestMapping public void picUpload(HttpServletRequest request,HttpServletResponse response){ try { log.info("==============开始上传图片================="); DefaultMultipartHttpServletRequest defaultRequest = (DefaultMultipartHttpServletRequest)request; MultiValueMap<String, MultipartFile> fileMap = defaultRequest.getMultiFileMap(); List<MultipartFile> fileList = fileMap.get("file"); MultipartFile file = fileList.get(0); if(!file.isEmpty()){ String s = file.getOriginalFilename(); String fileType = s.substring(s.lastIndexOf(".")+1); //上传图片,获取xml字符串 String urlXml = Upload.uploadImg(file.getBytes(),fileType,"Mall",""); //图片路径 String url = ""; XmlElement xmlElement = new XmlElement(); if(!StringUtils.isEmpty(urlXml)){ //解析xml字符串 xmlElement = ParseXml.XmlDocPic(urlXml); if(!StringUtils.isEmpty(xmlElement) && !StringUtils.isEmpty(xmlElement.getCode())){ if(xmlElement.getCode().equals("0")){ url = Propertys.getProval("serverUrl")+xmlElement.getFilePath()+xmlElement.getFileName(); xmlElement.setFilePath(url); } } } log.info("=====UploadController======picUpload======url:"+url); if(StringUtils.isEmpty(xmlElement.getErrMsg())){ xmlElement.setErrMsg("上传失败,连接图片服务器超时"); } response.setContentType("text/json;charset=utf-8"); Gson gson = new Gson(); String str = gson.toJson(xmlElement); response.getWriter().write(str); } } catch (Exception e) { e.printStackTrace(); log.info("======UploadController=========picUpload====异常====msg:"+e); } }
package com.mall.upload;

import java.io.File;
import java.io.FileOutputStream;
import java.io.InputStream;
import java.io.OutputStream;
import java.util.Date;
import java.util.List;

import javax.servlet.ServletContext;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.stereotype.Controller;
import org.springframework.util.MultiValueMap;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.context.ContextLoader;
import org.springframework.web.context.WebApplicationContext;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.multipart.support.DefaultMultipartHttpServletRequest;


@Controller
public class UploadControllerTest {
    //后台处理上传
    @RequestMapping
    public void picUpload(HttpServletRequest request,HttpServletResponse response){
        try {
                DefaultMultipartHttpServletRequest defaultRequest = (DefaultMultipartHttpServletRequest)request;
                MultiValueMap<String, MultipartFile> fileMap =  defaultRequest.getMultiFileMap();
                
                List<MultipartFile> fileList = fileMap.get("file");
                MultipartFile file = fileList.get(0);
                System.out.println("二进制流:"+file.getBytes());
                
                //String savePath = request.getSession().getServletContext().getRealPath("/newsImages/")+java.io.File.separator;
                WebApplicationContext webApplicationContext = ContextLoader.getCurrentWebApplicationContext();   
                ServletContext servletContext = webApplicationContext.getServletContext(); 
                String dirPath = servletContext.getRealPath("/WEB-INF/upload/");
                File dir = new File(dirPath);
                if(!dir.exists()){
                    dir.mkdir();
                }
                String filePath = dirPath+"/"+(new Date().getTime())+file.getOriginalFilename();
                //附件由临时文件夹下保存到本地
                File resultFile = inputstreamtofile(file.getInputStream(),filePath);
            
                //return filePath;
                //ControllerUtil.toJson(response, "11222");
                System.out.println("===============:"+filePath);
                response.getWriter().write("{"+filePath+"}");
                
                //获取页面地址参数
                //String imgUrl = request.getParameter("serverUrl");
                
                /*String ip = Propertys.getProval("appHost");
                int port = Integer.parseInt(Propertys.getProval("appPort"));
                String user = Propertys.getProval("appUser");
                String psw = Propertys.getProval("appPass");
                //服务器本地地址
                String url = Propertys.getProval("appUrl");
                //域名地址
                String appImgUrl = Propertys.getProval("appImgUrl");
                
                String filename = resultFile.getName();
                String fileType = filename.substring(filename.lastIndexOf(".")+1,filename.length());
                         
                String newname = System.currentTimeMillis()+"."+fileType;
                
                SshSftp1 sftp = new SshSftp1();
                String  filepath = sftp.sshSftp(ip,user,psw,port,url,appImgUrl,resultFile,newname);
                if(!StringUtils.isEmpty(filepath)){
                    String s = "{\"result\":\"" + filepath + "\"}";
                    return s;
                }else{
                    return "";
                }*/
                } catch (Exception e) {
                    e.printStackTrace();
                    //return "";
                }
    }
    
    public File inputstreamtofile(InputStream ins,String fileName) {
        File file = new File(fileName);
        try {
            OutputStream os = new FileOutputStream(file);
            int bytesRead = 0;
            byte[] buffer = new byte[8192];
            while ((bytesRead = ins.read(buffer, 0, 8192)) != -1) {
                os.write(buffer, 0, bytesRead);
            }
            
            os.close();
            ins.close();
        } catch (Exception e) {
            e.printStackTrace();
        }
        return file;
    }
}

 

 

 

 

上传图片,布布扣,bubuko.com

上传图片

标签:des   style   blog   http   color   java   os   io   

原文地址:http://www.cnblogs.com/lixin890808/p/3904793.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!