jsp文件上传 头像上传

大家好，欢迎来到IT知识分享网。

前言： 这篇文章简单介绍了文件上传的代码和我遇到的一些问题以及基于我实现的头像上传（不包含框架，仅仅达到目标即可）

一、整体效果：

（1）头像显示

（2）文件上传

（3）完成头像修改

（4）查看文件目录（这里已经上传成功而且文件名字也被更改了）

二、代码：

（1）首先是jsp页面部分：用form提交文件信息
< form action=“这里是servlet路径” method=” post（用post去处理） ” enctype=“multipart/form-data” >

设置input为file，顺便给他取个名儿
< input type=“file” name=“usrHeadImage” >

<form action="../uploadUsrImgSev" method="post" enctype="multipart/form-data">
				<div class="usrHeadChangeBox" id="usrHeadChangeBoxID">
					<input type="file" name="usrHeadImage">
					<input type="submit" value="上传" class="usrHeadChangeBoxSubmit">
					<span class="cancleBox"></span> 
				</div>
			</form>

（2）servlet部分：必须加上注解表示文件上传大小限制
1、@MultipartConfig(maxFileSize = 10 * 1024 * 1024) （如果不加，可能会出错但不会提示）

2、Part part = request.getPart(“usrHeadImage”); 里的参数就是刚刚的id（< input type=“file” name=“usrHeadImage” >）

3、这里的上传文件目录：File uploadFileDir = new File(“C:/MymusicUsrInfo/usrHeadImage/”);（如果只需要简单上传是可以上传成功的，但是若要在游览器里访问这个路径下我们上传的文件是需要涉及到虚拟路径配置的。游览器出于安全考虑是无法直接访问硬盘的文件，所以上传文件之后如何把他提取出来就是要考虑的问题）

4、把文件上传到我们设置的目录下（这里的separator就是一个 ‘ / ’ 斜杠）：part.write(uploadFileDir+File.separator+fileNameWithID);

@MultipartConfig(maxFileSize = 10*1024*1024)
...
...
...
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		response.setContentType("text/html;charset=utf-8");//这语句总感觉要出错
		request.setCharacterEncoding("utf-8");
		PrintWriter out = response.getWriter();
		Part part = request.getPart("usrHeadImage");
		//好消息！！如果设置的是 new File("C:/XXX/"); 就可以上传成功，看来现在的bug在于文件路径的错误,指定的是文件夹，而我上传的是文件夹+文件名，难道是这里的问题？
		File uploadFileDir = new File("C:/MymusicUsrInfo/usrHeadImage/");
		if(uploadFileDir.exists()) {
			uploadFileDir.mkdir();
		}
		//获取文件名
		String fileName=part.getSubmittedFileName();
		//给字符串加上用户id
		if(fileName != null) {
			HttpSession session = request.getSession(true);
			String usrName = (String)session.getAttribute("usrName");
			//获取文件后缀如 .jpg
			//图像名改为用户IDheadImage.jpg
			//如果上传同名文件，原有的文件会被覆盖
			String fileNameWithID = usrName + "IDheadImage" +fileName.substring(fileName.lastIndexOf("."), fileName.length());
			part.write(uploadFileDir+File.separator+fileNameWithID);
		}
		response.sendRedirect("JSPWEB/myMusic.jsp");
		return;
		
	}

（3）虚拟路径配置

1、找到Servers下的server.xml

2、找到host标签（ctrl + f 要快点）

3、配置路径代码

这里的 docBase 就是实际的目录路径， path 就是映射路径
（这里要注意的是反斜杠的方向 ，还有更改保存之后需要重新启动eclipse）

<Context docBase="C:\MymusicUsrInfo\usrHeadImage" path="/file" debug="0" reloadable="true" />

（4）在jsp里面重新获取我们上传的头像
前面的语句获取他的头像，这里的/file 就是我们之前弄得虚拟路径
后面img的src就是指向这个路径

<%
String usrHeadImgPath ="/file" +"/" + usrName + "IDheadImage" + ".jpg";
//这里和文件映射路径有关，需要到servers的server.xml里修改配置，并且需要 重新 启动eclipse 更新这个配置
%>
...
...
...
<span class="usrPicture" title="点击修改头像" onclick="displayUsrHeadChangeBox()"><img src="<%=usrHeadImgPath %>" class="usrPictureImge"/></span>

注意点： 头像更改后有时候没有变化可能是因为chrome没有清除之前的样式缓存，这里f12打开管理者模式勾选箭头f5刷新后就没问题了。

感谢看到最后，生活愉快 ( ^ _ ^ )