javaWeb中使用ajax上传文件
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上传文件的更多相关文章
- JavaWeb项目中使用ajax上传文件
1.jsp $("#cxsc").click(function(){ var bankId = $("#bankId").val(); var formdata ...
- IE8/9 JQuery.Ajax 上传文件无效
IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...
- springMVC+jsp+ajax上传文件
工作中遇到的小问题,做个笔记 实现springMVC + jsp + ajax 上传文件 HTML <body> <form id="myform" method ...
- Ajax上传文件进度条显示
要实现进度条的显示,就要知道两个参数,上传的大小和总文件的大小 html5提供了一个上传过程事件,在上传过程中不断触发,然后用已上传的大 小/总大小,计算上传的百分比,然后用这个百分比控制div框的显 ...
- 伪ajax上传文件
伪ajax上传文件 最近在折腾伪ajax异步上传文件. 网上搜索了一下,发现大部分方法的input file控件都局限于form中,如果是在form外的呢? 必须动态生成一个临时form和临时if ...
- flask jQuery ajax 上传文件
1.html 代码 <div> <form id="uploadForm" enctype="multipart/form-data" > ...
- ajax上传文件显示进度
下面要做一个ajax上传文件显示进度的操作,文末有演示地址 这里先上代码: 1.前端代码 upload.html <!DOCTYPE html> <html lang="e ...
- 闲话ajax,例ajax轮询,ajax上传文件[开发篇]
引语:ajax这门技术早已见怪不怪了,我本人也只是就自己真实的经验去总结一些不足道的话.供不是特别了解的朋友参考参考! 本来早就想写一篇关于ajax的文章的,但是前段时间一直很忙,就搁置了,趁着元旦放 ...
- models渲染字典&form表单上传文件&ajax上传文件
{# {% for u in teacher_d.keys %}#} {# {% for u in teacher_d.values %}#} {% for k,u in teacher_d.item ...
随机推荐
- SQL 添加索引
使用CREATE 语句创建索引 CREATE INDEX index_name ON table_name(column_name,column_name) include(score) 普通索引 C ...
- JUC同步锁(五)
根据锁的添加到Java中的时间,Java中的锁,可以分为"同步锁"和"JUC包中的锁". 一.同步锁--synchronized关键字 通过synchroniz ...
- class前置声明
https://www.cnblogs.com/King-Gentleman/p/5081159.html 当两个头文件互相包含的时候,类定义会编译出错,这时需要分别添加上对应的类声明 #includ ...
- codevs2822
解题思路: tarjan缩点后算出度为0的点有几个,如果只有一个且这个点为爱心天使就行了: #include<iostream> #include<algorithm> #in ...
- AMD三代锐龙箭在弦上:如此家族堪称豪华
AMD将于今年年中正式推出第三代Ryzen锐龙处理器,即不集成显示芯片的纯CPU产品,外界猜测可能的时间点会是5月底的台北电脑展. 虽说依然采用AM4接口,也就是X370/470老主板可无压力兼容,但 ...
- 【C/C++】求解线性方程组的雅克比迭代与高斯赛德尔迭代
雅克比迭代: /* 方程组求解的迭代法: 雅克比迭代 */ #include<bits/stdc++.h> using namespace std; ][]; ]; void swapA( ...
- Siki的虚幻第一季
空项目.一闪而过的解决方法 命名空间std::cout的作用: int ,long , long long类型的范围 unsigned int 0-4294967295 int 21474 ...
- 添加一个Android框架层的系统服务与实现服务的回调
2017-10-09 概述 所谓Android系统服务其本质就是一个通过AIDL跨进程通信的小Demo的延伸而已.按照 AIDL 跨进程通信的标准创建一套程序,将服务端通过系统进程来运行实现永驻内存, ...
- BZOJ1014[JSOI2008]火星人——非旋转treap+二分答案+hash
题目描述 火星人最近研究了一种操作:求一个字串两个后缀的公共前缀.比方说,有这样一个字符串:madamimadam,我们将这个字符串的各个字符予以标号:序号: 1 2 3 4 5 6 7 8 9 10 ...
- 51Nod 1381 硬币游戏
参考自:https://www.cnblogs.com/ECJTUACM-873284962/p/6445369.html 1381 硬币游戏 基准时间限制:1 秒 空间限制:131072 KB 分值 ...