实现普通表单文本上传和二进制文件上传

<script type="text/javascript" src="js/jquery-1.8.2.js"></script>
<script type="text/javascript">
	$(function(){
		$("#name").blur(function(){
			var name = $("#name").val();
			if(name!="" && name!=null){
				$.post("UserServlet?action=checkName&name="+name,function(data){
					if(data=="1"){
						$("#sname").html("用户已存在")
					}else{
						$("#sname").html("");
					}
				})				
				$("#span").html("");
			}
		});
		$("#email").blur(function(){
			var email = $(this).val();
			if(email!="" && email!=null){
				$.post("UserServlet?action=checkEmail&email="+email,function(data){
					if(data=="1"){
						$("#sEmail").html("该邮箱已注册")
					}else{
						$("#sEmail").html("");
					}
				})
				$("#span").html("");
			}
		});
	})
</script>

<body>
	<span id="span">${msg}</span>
	<form action="UserServlet?action=register" method="post" enctype="multipart/form-data">
		用户名:<input type="text" name="name" id="name"/><span id="sname"></span><br>
		密码:<input type="text" name="password" /><br>
		爱好:<input type="checkbox" name="loves" value="tb"/>篮球
		<input type="checkbox" name="loves" value="sw"/>游泳
		<input type="checkbox" name="loves" value="ft"/>足球<br>
		邮箱:<input type="text" name="email" id="email"/><span id="sEmail"></span><br>
		头像上传:<input type="file" name="file"/><br>
		<input type="submit" value="注册" />
	</form>
</body>

以下为后端：

String action = request.getParameter("action");
		List<User> userList = DBCentre.list;
		switch (action) {
		case "register":
			DiskFileItemFactory factory = new DiskFileItemFactory();
			ServletFileUpload upload = new ServletFileUpload(factory);
			Map<String, String> map = new HashMap<>();
			User user = new User();
			try {
				List<FileItem> list = upload.parseRequest(request);
				for (FileItem fileItem : list) {
					if (fileItem.isFormField()) {
						String value = map.get(fileItem.getFieldName());
						if (value==null) {
							map.put(fileItem.getFieldName(), fileItem.getString("utf-8"));
						}else{
							map.put(fileItem.getFieldName(), value+","+fileItem.getString("utf-8"));
						}
					}else{
						String parent = getServletContext().getRealPath("img");
						File file = new File(parent);
						if (!file.exists()) {
							file.mkdirs();
						}
						UUID uudi = UUID.randomUUID();
						File allFile = new File(parent,uudi.toString()+"_"+fileItem.getName());
						IOUtils.copy(fileItem.getInputStream(), new FileOutputStream(allFile));
						user.getList().add("img/"+uudi.toString()+"_"+fileItem.getName());
					}
				}
				BeanUtils.populate(user, map);
				DBCentre.list.add(user);
				response.sendRedirect("login.jsp");
			} catch (FileUploadException e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			} catch (IllegalAccessException e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			} catch (InvocationTargetException e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			}
			break;

文件下载（前端）：

<script type="text/javascript" src="js/jquery-1.8.2.js"></script>
<script type="text/javascript">
	$(function(){
		$("#img").click(function(){
			var img = $("#src").attr("src");
			debugger
			$(this).attr("href","UserServlet?action=dowload&img="+img);
		});
	})
</script>

<a href="#" id="img"><img alt="未显示" src="${url}" id="src" width="200px" height="200px"></a>

文件下载（后端）：

        String path = request.getParameter("img");
			String fileName = path.substring(path.lastIndexOf("/")+1);
			fileName = URLEncoder.encode(fileName, "utf-8");
			response.setHeader("Content-disposition", "attachment;fileName="+fileName);
			path = getServletContext().getRealPath(path);
			IOUtils.copy(new FileInputStream(path), response.getOutputStream());
			break;

注意：上传下载需要依赖的包名称-----

1、commons-beanutils-1.8.3.jar

2、commons-fileupload-1.2.2.jar

3、commons-io-2.2.jar

4、commons-logging-1.1.1.jar

5、jstl-1.2.jar

实现普通表单文本上传和二进制文件上传

猜你喜欢