javaWeb上传图片

上传文件所必要的两个jar包:commons-fileupload.jar、commons-io.jar。

jar包下载:github路径

核心代码:

 String withPath = req.getServletContext().getRealPath("/");//获取网站的URI根路径(网站资源路径,存内容到这里可以通过浏览器访问)
String webPath = req.getContextPath();//获取网站的URL根路径(访问网站跟路径)
DiskFileItemFactory factory = new DiskFileItemFactory();
factory.setSizeThreshold(2048 * 500);
File file = new File(withPath + "\\temp");// 临时存储文件位置
String path = withPath + "\\upload";// 文件保存位置
factory.setRepository(file);
ServletFileUpload upload = new ServletFileUpload(factory);
upload.setSizeMax(1024 * 1024);// 最大的文件文1M(1024KB)
List<FileItem> items = upload.parseRequest(req);
for (FileItem item : items) {
// 如果只上传一个文件那么可以不用循环
System.out.println("for---");
if (item.isFormField()) {
// 上传的不是文件域
jo.put("status", "error");
jo.put("msg", "上传图片失败");
System.out.println(
item.getFieldName() + ":" + item.getString());
}
else {
String fileName = item.getName();// 文件名(包括扩展名)
System.out.println("文件名为:" + fileName);
jo.put("status", "true");
InputStream in = item.getInputStream();
byte[] buffer = new byte[1024];
int len = 0;
String allFileName = path + "\\" + fileName;
OutputStream os = new FileOutputStream(allFileName);
while ((len = in.read(buffer)) != -1) {
os.write(buffer, 0, len);
}
os.close();
in.close();
jo.put("status", "true");
jo.put("msg", "上传图片成功");
jo.put("imgUrl", webPath + "/upload/" + fileName);
}
}

2.html

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>上传文件</title>
<script type="text/javascript" src="<%=path%>/static/lib/myUtils.js"></script>
<script type="text/javascript" src="<%=path%>/static/js/jquery-1.11.1.js"></script>
</head>
<body>
<input type="file"/>
<div class="msg"></div>
<script type="text/javascript">
$(document).ready(function(){
var img_formats = "jpeg,jpg,bmp,png,gif,ico,tiff,pcx,tga,exif,fpx,svg,psd,cdr,pcd,dxf,ufo,eps,ai,raw,wmf";
var file = $("input[type='file']");
file.change(function(){
var files=this.files;
var formData=new FormData();
formData.append('files',files[0]);
var img_format = myUtils.file_format(files[0].name);
console.log(files[0].name);
if(img_format.length > 0){
if(img_formats.indexOf(img_format) >= 0){
var img = myUtils.getFileUrl(files[0]);
$.ajax({
url: "<%=path%>/uploadServlet",
type: "POST",
data: formData,
dataType:"json",
/**
*必须false才会自动加上正确的Content-Type
*/
contentType: false,
/**
* 必须false才会避开jQuery对 formdata 的默认处理
* XMLHttpRequest会对 formdata 进行正确的处理
*/
processData: false,
success: function (data) {
console.log(data);
if (data.status == "true") {
alert(data.msg);
$(".msg").html("<img src='"+data.imgUrl+"'/>");
}
if (data.status == "error") {
alert(data.msg);
}
$("#imgWait").hide();
},
error: function () {
alert("上传失败!");
$("#imgWait").hide();
}
});
}else{
$(".msg").text("请上传图片文件");//不是图片文件
}
}else{
$(".msg").text("上传的不是一个有效的文件");//文件没有后缀名
}
});
});
</script>
</body>
</html>

注意:上传图片的位置要放在->网站资源路径;而不是本地的资源路径,否则上传之后无法在浏览器中预览图片切记!!!

本人小白,各位大神有好的建议多多提点,一起学习共同进步

javaWeb中使用ajax上传文件的更多相关文章

  1. JavaWeb项目中使用ajax上传文件

    1.jsp $("#cxsc").click(function(){ var bankId = $("#bankId").val(); var formdata ...

  2. IE8/9 JQuery.Ajax 上传文件无效

    IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...

  3. springMVC+jsp+ajax上传文件

    工作中遇到的小问题,做个笔记 实现springMVC + jsp + ajax 上传文件 HTML <body> <form id="myform" method ...

  4. Ajax上传文件进度条显示

    要实现进度条的显示,就要知道两个参数,上传的大小和总文件的大小 html5提供了一个上传过程事件,在上传过程中不断触发,然后用已上传的大 小/总大小,计算上传的百分比,然后用这个百分比控制div框的显 ...

  5. 伪ajax上传文件

    伪ajax上传文件   最近在折腾伪ajax异步上传文件. 网上搜索了一下,发现大部分方法的input file控件都局限于form中,如果是在form外的呢? 必须动态生成一个临时form和临时if ...

  6. flask jQuery ajax 上传文件

    1.html 代码 <div> <form id="uploadForm" enctype="multipart/form-data" > ...

  7. ajax上传文件显示进度

    下面要做一个ajax上传文件显示进度的操作,文末有演示地址 这里先上代码: 1.前端代码 upload.html <!DOCTYPE html> <html lang="e ...

  8. 闲话ajax,例ajax轮询,ajax上传文件[开发篇]

    引语:ajax这门技术早已见怪不怪了,我本人也只是就自己真实的经验去总结一些不足道的话.供不是特别了解的朋友参考参考! 本来早就想写一篇关于ajax的文章的,但是前段时间一直很忙,就搁置了,趁着元旦放 ...

  9. models渲染字典&form表单上传文件&ajax上传文件

    {# {% for u in teacher_d.keys %}#} {# {% for u in teacher_d.values %}#} {% for k,u in teacher_d.item ...

随机推荐

  1. How to install Windows 7 SP1 on Skylake

    Download gigabyte windows usb installation tool http://www.gigabyte.cn/WebPage/-79/usb.html get Wind ...

  2. github上传时出现error: src refspec master does not match any解决办法22

    1 error:src refspec master does not match any这个问题,我之前也遇到过,这次又遇到了只是时间间隔比较长了,为了防止以后再遇到类似问题,还是把这个方法简单记录 ...

  3. 学习 Spring (六) 自动装配

    Spring入门篇 学习笔记 No: (默认)不做任何操作 byName: 根据属性名自动装配.此选项将检查容器并根据名字查找与属性完全一致的 bean,并将其与属性自动装配 byType: 如果容器 ...

  4. 开始一个简单的ASP.NET Web API 2 (C#)

    创建一个Web API 项目 在本教程中,你将使用ASP.NET Web API 来创建一个web API 并返回产品列表. 网页前端使用jQuery 显示结果. 选择ASP.NET Web Appl ...

  5. linux 目录分类与文件操作

    / 虚拟根目录 一般不会在这里存储文件 /bin 二进制目录,存放需要GNU用户级的工具 /boot 启动目录,存放启动文件 /dev 设备目录,linux在这里创建设备节点 /etc 系统配置文件目 ...

  6. 前端部分-CSS基础介绍

    CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素.也就是定义相应的标签语言来定制显示样式达到一定的显示效果. 每个CSS样式由两个组成部分:选择器和 ...

  7. VMware ezmomi工具使用

    用两个静态IP克隆模板: ezmomi clone --template centos67 --hostname test01 --cpus 2 --mem 4 --ips 172.10.16.203 ...

  8. 用递归方法解决汉诺塔问题(Recursion Hanoi Tower Python)

    汉诺塔问题源于印度的一个古老传说:梵天创造世界的时候做了三根金刚石柱子,在一根柱子上从下往上按照大小顺序摞着64片黄金圆盘.梵天命令婆罗门把圆盘按大小顺序重新摆放在另一根柱子上,并且规定小圆盘上不能放 ...

  9. bzoj1559 [JSOI2009]密码

    题目链接:[JSOI2009]密码 我们先看第一问:输出方案数 我们把所有给出来的串丢到AC自动机里面去,然后在建出来的\(trie\)图上跑dp 由于\(n\leq 10\)我们很自然的就想到了状压 ...

  10. 普通Splay详解

    预备知识: 二叉搜索树(BST) 至于BST,随便看一下就可以, 我们知道二叉搜索树是O(logN)的,那我们为什么要用平衡树呢? 之前我们了解到,BST的插入是小的往左子树走,大的往右子树走,如果凉 ...