根目录97 <input file>标签，把图片上传到服务器（跟增删改查一起实现）

  1 首先来个简单的html页面： enctype="multipart/form-data" encoding="multipart/form-data" action="../../后台/后台方法.do"  //form表单加上这几个属性 action指向后台添加方法
  2
  3 <input type="button" id="uupdatekeyword2" value="修改" onready="true" class="btns submitform"/>
  4 <input type="button" value="取消" id="vcancel" class="btns btnCancel" style="margin-left:10px;"/>
  5 <input type="button" onready="true"  value="开始上传" class="btns submitform"/>&nbsp;    //开始上传的按钮，主要是submitform方法
  6
  7 //上传 javascript代码  还有一些参数跟着一起存进数据库
  8 $(".submitform").live("click",function(){
  9 var $this = $(this);
 10 var j = location.href;
 11 var idd=j.substring(j.indexOf("=")+15,j.length);　　//截取字符串 获得ID
 12 $("#iiii").val(idd);　　//把ID赋给隐藏域 input，后台取得id作为条件进行查询
 13 $("#noticecontentStr").val(editor.html());　　　//无法获取编辑器的值，所以赋给隐藏域，后台获取隐藏域的值进行添加
 14 $this.parents("form").find("td input[type!=‘button‘],td select").siblings("span").remove();
 15 $this.parents("form").find("td input[type!=‘button‘],td select").show();
 16 if ($this.attr("onready") == "false") {
 17 $this.attr("onready", "true");
 18 $this.val("保存");
 19 return false;}
 20 $("#noticecontentStr").val(editor.html());
 21 $this.parents(‘form‘).ajaxSubmit({
 22 dataType: ‘json‘,
 23 type: ‘post‘,
 24 iframe:true,
 25 cache:false,
 26 resetForm:false,
 27 beforeSubmit: function() {
 28 //获取编辑控件的值
 29 $this.parents("form").find(".required[disabled=false]").blur();
 30 if ($this.parents(‘form‘).find("font[class=‘error‘]").length) {
 31 $this.parents(‘form‘).find("font[class=‘error‘]").eq(0).siblings("input,select,textarea").focus();
 32 return false;}},success: function(data) {
 33 $this.parents(‘form‘).find("#fileField").hide();
 34 if(data==‘-1‘){
 35 jAlert("您目前没有权限进行此操作！");
 36 }else if(data=="-2"){
 37 jAlert("系统异常");
 38 }else if(data.flag=="0"){
 39 jAlert("保存成功","系统消息",function (){
 40 window.location.reload();
 41 $this.parents(".dialog").dialog("close");});
 42 ajaxNoticeList();
 43 }else if(data.flag == "1" || data.flag == "2" || data.flag == "3"){
 44 jAlert(data.message);}}});
 45 });
 46
 47 前台做完开始做后台咯：（先定义一些属性和类，封装起来）
 48
 49 private File upload;//文件的
 50 private String uploadFileName;//文件的名称
 51 /**
 52 * 返回结果
 53 */
 54 private TheResult tr = new TheResult();
 55
 56 private static List<String> allowFileSuffix = new ArrayList<String>();
 57 public UserSeriviceImpl getLos() {
 58 return los;
 59 }
 60 public void setLos(UserSeriviceImpl los) {
 61 this.los = los;
 62 }
 63 public TheResult getTr() {
 64 return tr;
 65 }
 66 public void setTr(TheResult tr) {
 67 this.tr = tr;
 68 }       //下面开始进入主题
 69 //创建公告
 70 @RequestMapping("/添加方法.do")
 71 public void newCelue(){
 72 TheResult result = null;
 73 try {　　//调用下面上传文件的代码，用类对象接收(result)
 74 result = 上传文件方法(tr);// 先上传文件，如果文件上传成功再保存公告内容
 75 if(null != result && "0".equals(result.getFlag())){
 76
 77 // 主标题
 78 String title = this.getParamNotNnll("title");
 79 //内容
 80 String value=this.getParamNotNnll("crmNoticeManage.contentStr");
 81 byte[] valuebyte = value.getBytes();//......很多内容
 82
 83 Map<String, Object> cemap = new HashMap<String, Object>();
 84 cemap.put("id",userId);　　//把ID存到map集合里
 85
 86
 87 User u = los.findeuser(cemap);
 88 String name=u.getName();//作者 根据id获得其他表的数据
 89
 90 ZdcjCelue zdcjCelue=new ZdcjCelue();
 91 zdcjCelue.setTitle(title);//主标题   ....存入对象进行添加
 92 try {
 93 zcService.newCelue(zdcjCelue);
 94 result.setMessage("创建成功！");
 95 result.setFlag("0");
 96 } catch (Exception e) {
 97 result.setFlag("3");
 98 e.printStackTrace();
 99 }
100 }
101 } catch (Exception e) {
102 result.setFlag("3");
103 e.printStackTrace();
104 }
105 outJSONData(JSONUtils.beanToJson(result));
106 }
107
108 //开始上传文件咯！
109
110 /**
111 * 上传附件
112 * @return
113 */
114 public TheResult 上传文件方法(TheResult tr) {
115 String cc="celue";   //图片存在服务器上的路径
116 String rd="rd";
117 MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
118 /**页面控件的文件流**/
119 MultipartFile multipartFile = multipartRequest.getFile("upload");   //upload指的是前端input的name
120 String fileName=multipartFile.getOriginalFilename();
121 String folderName=cc+"/"+DateUtil.getDataStringDir();　　//产生一天的日期字符串，因为图片有可能重复，防止重复
122 int fileSize=0;
123 String stuffixForFile = multipartFile.getOriginalFilename().substring(multipartFile.getOriginalFilename().lastIndexOf(".") + 1);
124 if (!getAllowFileSuffix().contains(stuffixForFile)) {//检查文件是否在允许上传的范围之内
125 tr.setFlag("1");
126 tr.setMessage("出于安全性考虑，不允许添加此种格式(."+stuffixForFile+")文件。");
127 return tr;
128 }
129 try {
130 InputStream is=multipartFile.getInputStream();
131 fileSize=is.available();
132 if ((fileSize / 1024) > 1024 * 2) {
133 tr.setFlag("2");
134 tr.setMessage("上传文件大于2MB");
135 return tr;
136 }
137 String ip=GlobalUtil.pps.getProperty("FTP.ip");//上传服务器地址
138 String username=GlobalUtil.pps.getProperty("FTP.username");//用户名
139 String password=GlobalUtil.pps.getProperty("FTP.password");//密码
140 FTPUtil.connServer(ip, username, password,"");
141 FTPUtil.createDir(folderName);
142 FTPUtil.uploadFile(fileName, is);
143 } catch (IOException e) {
144 e.printStackTrace();
145 tr.setFlag("3");
146 tr.setMessage("上传文件异常！");
147 return tr;
148 }finally{
149 FTPUtil.closeServer();
150 }
151 String url="/"+folderName+"/"+fileName;
152 tr.setFlag("0");
153 tr.setMessage("上传成功！");
154 tr.setShowURL(url);
155 tr.setRecName(multipartFile.getOriginalFilename());
156 return tr;
157 }　　//下面还有一个方法需要填上
158
159 public static List<String> getAllowFileSuffix() {
160 if (allowFileSuffix == null || allowFileSuffix.size() < 1) {
161 String stuffix = "gif,jpg,jpeg,png,bmp,swf,flv,swf,flv,mp3,wav,wma,wmv,mid,avi,mpg,asf,rm,rmvb,doc,docx,xls,xlsx,ppt,htm,html,txt,zip,rar,gz,bz2";
162 if (allowFileSuffix == null) {
163 allowFileSuffix = new ArrayList<String>();
164 }
165 allowFileSuffix.clear();
166 for (String stuf : stuffix.split(",")) {
167 allowFileSuffix.add(stuf);
168 }
169 }
170 return allowFileSuffix;
171 }　　//不要忘记set方法
172
173 public static void setAllowFileSuffix(List<String> allowFileSuffix) {
174 ZdcjCelueAction.allowFileSuffix = allowFileSuffix;
175 }//至此 已经完成了图片上传。 显示服务器上的图片很简单<img class=‘img-responsive‘ src=‘http://121.41.57.4/images"+comment.coverImg+"‘>一定要对应好服务器图片的位置，
176
177 上面说过有一个Result类：↓
178
179 package com.kinglo.im.util;
180
181 import java.util.List;
182
183 /**
184 * 处理结果
185 *
186 * @author tr 2012-07-17
187 */
188 public class TheResult {
189
190 /**
191 * 标记 0--成功，1--异常，2--失败
192 */
193 private String flag;
194 /**
195 * 返回消息
196 */
197 private String message;
198
199 /**
200 * 刷新页面的访问路径
201 */
202 private String showURL;
203 /**
204 * 是否关闭当前层(true--是，false--否)
205 */
206 private boolean whetherClose;
207
208 /**
209 * 是否刷新页面(true--是，false--否)
210 */
211 private boolean whetherRefresh = true;
212
213 private String checkbox;
214
215 private Integer type;
216 private String userid;
217 private String subject;
218 private String senderName;//发送者姓名
219 private String reciveName;//接受者姓名
220 private Long sender;//发送者ID
221 private Long recive;//接收者ID
222 private String text;
223 private Integer taskid;
224 private String sendName;
225 private String recName;
226 private String tpid;
227 private String agentid;
228 private String iscomplete;
229 private String username;
230 public String getUsername() {
231 return username;
232 }
233
234 public void setUsername(String username) {
235 this.username = username;
236 }
237
238 private String password;
239 public String getPassword() {
240 return password;
241 }
242
243 public void setPassword(String password) {
244 this.password = password;
245 }
246
247 public String getNeibuqunid() {
248 return neibuqunid;
249 }
250
251 public void setNeibuqunid(String neibuqunid) {
252 this.neibuqunid = neibuqunid;
253 }
254
255
256
257 public String getWaibuqunid() {
258 return waibuqunid;
259 }
260
261 public void setWaibuqunid(String waibuqunid) {
262 this.waibuqunid = waibuqunid;
263 }
264
265 private String neibuqunid;
266 private String waibuqunid;
267 private String isCallerRbt;
268 /**
269 * 当前第几页
270 */
271 private int currPage = 1;
272 /**
273 * 当前页显示记录数
274 */
275 private int pageSize = 10;
276
277 private String companyCode;
278
279 private String isExtFlag;//是否转分机
280
281 private String isJobNumFlag;//是否报工号
282
283 private String isJobId;//是否弹屏
284
285
286 private String subaccount;
287 private String subaccountpwd;
288 private String voipid;
289 private String voippwd;
290
291 public String getTpid() {
292 return tpid;
293 }
294
295 public void setTpid(String tpid) {
296 this.tpid = tpid;
297 }
298
299 public String getFlag() {
300 return flag;
301 }
302
303 public void setFlag(String flag) {
304 this.flag = flag;
305 }
306
307 //这里进行封装get() set()方法
308
309 }
310
311 /**
312 * 图片上传（这个是另一种方法的action）
313 */
314 @RequestMapping("/uploadImages.do")
315 public void uploadImages(){
316 try {
317 String regExp="jpg|bmp|jpeg|png|gif";
318 Pattern pattern=Pattern.compile(regExp,Pattern.CASE_INSENSITIVE+Pattern.MULTILINE);
319 System.out.println("ss:"+uploadFileName);
320 Matcher matcher=pattern.matcher(uploadFileName);//这个为空if(!matcher.find()){
321 this.outJSONDataString("{\"error\":1,\"message\":\"请上传正确格式的图片!\"}");}else{
322 FileInputStream fis=new FileInputStream(upload);//这个也为空
323 if(fis.available()>1536000){
324 this.outJSONDataString("{\"error\":1,\"message\":\"每张图片最大不能超过1.5MB!\"}");}else{
325 String width=this.getParamNotNnll("width").trim();
326 String height=this.getParamNotNnll("height").trim();
327 String title=this.getParamNotNnll("title").trim();
328 String align=this.getParamNotNnll("align").trim();
329 String url=request.getRequestURL().toString();
330 String path="";//getServletContext().getRealPath("").replace("\\", "\\\\")+"/noticedirectory/"+Context.getCurrentUser().getCompanyCode()+"/temp/"+DateUtil.getDateToString(new Date())+uploadFileName.substring(uploadFileName.lastIndexOf("."));
331 String imgPath="";//url.substring(0, url.indexOf(getRequest().getContextPath()))+getRequest().getContextPath()+"/noticedirectory/"+Context.getCurrentUser().getCompanyCode()+"/temp/"+DateUtil.getDateToString(new Date())+uploadFileName.substring(uploadFileName.lastIndexOf("."));
332 File file =new File(path);
333 if(!file.exists()){try {file.createNewFile();} catch (Exception e) {File dir=new File(file.getParent());dir.mkdirs();file.createNewFile();}}
334 FileOutputStream fos=new FileOutputStream(file);
335 int len=0;byte[] b=new byte[1024];
336 while((len=fis.read(b))!=-1){fos.write(b, 0, len);}fis.close();fos.flush();fos.close();
337 this.outStringData("{\"error\":0,\"url\":\""+imgPath+"\",\"path\":\""+path+"\",\"width\":\""+width+"\",\"height\":\""+height+"\",\"title\":\""+title+"\",\"align\":\""+align+"\"}");}}
338 } catch (Exception e) {e.printStackTrace();}}
时间： 2024-10-29 00:45:47

根目录97 <input file>标签，把图片上传到服务器（跟增删改查一起实现）的相关文章

php form 图片上传至服务器上

本文章也是写给自己看的,因为写的很简洁,连判断都没有,只是直接实现了能上传的功能. 前台: <form action="upload.php" method="POST" enctype="multipart/form-data"> <input type="file" name="myfile" /> <input type="submit" value=

felayman——PHP中图片上传到服务器

1.upload_file.php <?php //该文件负责获取上传的图片的扩展名和随机生成文件名 header("content-type:text/html;charset=utf-8"); /** * 获取文件扩展名 *Enter description here ... * @param unknown_type $filename */ function getFileName($filename){ //strrchr- 查找指定字符在字符串中的最后一次出现 ret

使用canvas给图片添加水印， canvas转换base64,,canvas，图片，base64等转换成二进制文档流的方法，并将合成的图片上传到服务器,

一,前端合成带水印的图片 一般来说,生成带水印的图片由后端生成,但不乏有时候需要前端来处理.当然,前端处理图片一般不建议,一方面js的处理图片的方法不全,二是有些老版本的浏览器对canvas的支持度不够. 下面我们就说说,利用canvas 生成带水印的图片. 1.我们要实现一下效果 2.创建一个canvas var canvas = document.createElement('canvas'); var time = new Date(); var logoCanvas =time+' '+

h5 input file ajax实现文件上传

<input type="file" accept="image/*" height="0" class="file_input" id="file_input_ss_0" multiple>  文件域 遇到的几个BUG 已经解决 1 多选文件域,如果没有上传成功或已上传成功,再次点击文件域名选择图片时,会累积上次的文件. 例如 第一次上传1.jpg  第二次点击上传 2.jpg 第二次的上传结

模板不存在:./xx 错误位置 FILE: LINE:110 (thinkphp上传至服务器后模板无法解析原因)

thinkphp上传至服务器后模板无法解析原因 前几日做好的响应式静态页面上传至虚拟空间,打开网址地址出现: 模板不存在:./App/Admin/View/Config/customerService.html 错误位置 FILE: /home/wwwroot/www.dabai99.com/ThinkPHP/Library/Think/View.class.php LINE: 110 查了下百度,原来上面路径中的Index在网站文件中的文件夹名称则实为index,有大小写的区分.在本地调试程序

input(file)样式修改及上传文件名显示

实现思路: a标签包裹input元素 设置a标签为上传按钮的样式,相对定位 设置input为透明,绝对定位,覆盖到a上面 效果:看到的按钮是a的样式,点击时实际是点击input元素.样式和功能都具备 html代码: <a href="javascript:;" class="file gradient">选择文件 <input type="file" > </a> CSS代码: .file { position

input file美化，文件上传

此文学习至:http://www.haorooms.com/post/input_file_leixing 然而只会用,不会做,UI泪茫茫 效果图: 原图: 美化后: 此主要用css美化表单,然后用Jq提交表单 1.css <style> .a-upload { padding: 4px 4px 10px 10px; height: 25px; line-height: 20px; position: relative; cursor: pointer; color: #888; backgr

用最少的html标签实现图片上传进度展示

html结构: <div class="parent"> <img class="image" src="http://h.hiphotos.baidu.com/baike/c0%3Dbaike80%2C5%2C5%2C80%2C26/sign=94d19969d40735fa85fd46ebff3864d6/8644ebf81a4c510fe630d9686059252dd52aa5cf.jpg"/> <div c

android选择图片或拍照图片上传到服务器(包括上传参数)

From:http://blog.csdn.net/springsky_/article/details/8213898具体上传代码: 1.选择图片和上传界面,包括上传完成和异常的回调监听 [java] view plaincopy package com.spring.sky.image.upload; import java.util.HashMap; import java.util.Map; import android.app.Activity; import android.app.