上传原理图
pom.xml
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.3.1</version>
</dependency>
<dependency>
<groupId>commons-io</groupId>
<artifactId>commons-io</artifactId>
<version>2.4</version>
</dependency>
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.10.0</version>
</dependency>
<!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-core -->
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-core</artifactId>
<version>2.10.0</version>
</dependency>
<!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-annotations -->
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-annotations</artifactId>
<version>2.10.0</version>
</dependency>
springmvc.xml
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:mvc="http://www.springframework.org/schema/mvc"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="
http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans.xsd
http://www.springframework.org/schema/mvc
http://www.springframework.org/schema/mvc/spring-mvc.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context.xsd">
<!-- 开启注解扫描 -->
<context:component-scan base-package="com.long123"/>
<!-- 视图解析器对象 -->
<bean id="internalResourceViewResolver" class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix" value="/WEB-INF/pages/"/>
<property name="suffix" value=".jsp"/>
</bean>
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<property name="maxInMemorySize" value="1000000000"></property>
</bean>
<!-- 配置静态文件放行 -->
<mvc:default-servlet-handler />
<!-- 开启SpringMVC框架注解的支持 -->
<mvc:annotation-driven />
</beans>
html 上传
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>Title</title>
</head>
<body>
<h1>上传文件</h1>
<h3>传统上传</h3>
<form action="user/uploadFile" method="post" enctype="multipart/form-data">
选择文件:<input type="file" name="upload">
<input type="submit" value="load">
</form>
<br/>
<h3>springmvc上传</h3>
<form action="user/uploadFile2" method="post" enctype="multipart/form-data">
选择文件:<input type="file" name="upload">
<input type="submit" value="load">
</form>
<br/>
<h3>springmvc跨服务器上传</h3>
<form action="user/uploadFile3" method="post" enctype="multipart/form-data">
选择文件:<input type="file" name="upload">
<input type="submit" value="load">
</form>
</body>
</html>
Contorller
package com.long123.Controller;
import com.sun.jersey.api.client.Client;
import com.sun.jersey.api.client.WebResource;
import org.apache.commons.fileupload.FileItem;
import org.apache.commons.fileupload.disk.DiskFileItemFactory;
import org.apache.commons.fileupload.servlet.ServletFileUpload;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;
import javax.servlet.http.HttpServletRequest;
import java.io.File;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
@Controller
@RequestMapping("/user")
public class UserController {
@RequestMapping("/uploadFile")
public String uploadFile(HttpServletRequest request) throws Exception {
// 获取要上传的文件目录
String realPath = request.getSession().getServletContext().getRealPath("/upload");
System.out.println(realPath);
// 创建文件对象
File file = new File(realPath);
if (!file.exists()){
// 路径不存在,创建
file.mkdirs();
}
// 创建磁盘文件项工厂
DiskFileItemFactory factory = new DiskFileItemFactory();
ServletFileUpload fileUpload = new ServletFileUpload(factory);
// 解析request对象
List<FileItem> items = fileUpload.parseRequest(request);
// 遍历
for (FileItem fileItem:items) {
// 判断文件项是上传的文件还是普通字段
if (fileItem.isFormField()) {
}else {
// 上传文件项
// 获取文件上传的名称
String fileName = fileItem.getName();
// 上传文件
fileItem.write(new File(file,fileName));
// 删除临时文件
fileItem.delete();
}
}
return "success";
}
@RequestMapping("/uploadFile2")
public String uploadFile2(HttpServletRequest request, MultipartFile upload) throws Exception {
// 获取要上传的文件目录
String realPath = request.getSession().getServletContext().getRealPath("/upload");
System.out.println(realPath);
// 创建文件对象
File file = new File(realPath);
if (!file.exists()){
// 路径不存在,创建
file.mkdirs();
}
// 获取文件上传的名称
String fileName = upload.getOriginalFilename();
// 上传文件
upload.transferTo(new File(file,fileName));
return "success";
}
/**
* 跨服务器上传
* @param upload
* @return
* @throws Exception
*/
@RequestMapping("/uploadFile3")
public String uploadFile3(MultipartFile upload) throws Exception {
// 图片服务器路径
String path = "http://localhost:9090/upload/";
// 获取文件上传的名称
String fileName = upload.getOriginalFilename();
//创建客户端对象
Client client = Client.create();
// 连接图片服务器
WebResource webResource = client.resource(path+fileName);
// 上传文件
webResource.put(upload.getBytes());
return "success";
}
}
layui 上传
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<meta charset="utf-8">
<title>文件上传</title>
<link rel="stylesheet" href="${pageContext.request.contextPath}/resources/layui/css/layui.css">
</head>
<body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>常规使用:普通图片上传</legend>
</fieldset>
<div class="layui-upload">
<button type="button" class="layui-btn" id="test1">上传图片</button>
<div class="layui-upload-list">
<img class="layui-upload-img" id="demo1">
<p id="demoText"></p>
</div>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>选完文件后不自动上传</legend>
</fieldset>
<div class="layui-upload">
<button type="button" class="layui-btn layui-btn-normal" id="test8">选择文件</button>
<button type="button" class="layui-btn" id="test9">开始上传</button>
</div>
<script src="${pageContext.request.contextPath}/resources/layui/layui.js"></script>
<script>
//一般直接写在一个js文件中
layui.use(['jquery','upload'], function(){
var $ = layui.jquery;
var upload = layui.upload;
//普通图片上传
var uploadInst = upload.render({
elem: '#test1'
,url: 'user/uploadFile22'
,accept:'images' // 上传的文件类型
,acceptMime: 'image/*' //打开选择框显示所有图片类型
,auto:true // 是否自动上传
,field:'upload' // 表单的name 值 MultipartFile upload
,before: function(obj){
//预读本地文件示例,不支持ie8
obj.preview(function(index, file, result){
$('#demo1').attr('src', result); //图片链接(base64)
});
}
,done: function(res){
alert(res)
//如果上传失败
if(res.code > 0){
return layer.msg('上传失败');
}
//上传成功
return layer.msg('上传成功');
}
,error: function(){
//演示失败状态,并实现重传
var demoText = $('#demoText');
demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
demoText.find('.demo-reload').on('click', function(){
uploadInst.upload();
});
}
});
//选完文件后不自动上传
upload.render({
elem: '#test8'
,url: 'user/uploadFile22'
,auto: false
//,multiple: true
,bindAction: '#test9' //指向一个按钮触发上传
,field:'upload' // 表单的name 值 MultipartFile upload
,done: function(res){
//如果上传失败
if(res.code > 0){
return layer.msg('上传失败');
}
//上传成功
return layer.msg('上传成功');
},
error: function() {
//演示失败状,
return layer.msg('上传错误,请重试');
}
});
});
</script>
</body>
</html>
Controller
package com.long123.Controller;
import com.sun.jersey.api.client.Client;
import com.sun.jersey.api.client.WebResource;
import org.apache.commons.fileupload.FileItem;
import org.apache.commons.fileupload.disk.DiskFileItemFactory;
import org.apache.commons.fileupload.servlet.ServletFileUpload;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;
import javax.servlet.http.HttpServletRequest;
import java.io.File;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
@Controller
@RequestMapping("/user")
public class UserController {
@RequestMapping("/uploadFile22")
@ResponseBody
public Map<String,Object> uploadFile22(HttpServletRequest request, MultipartFile upload) throws Exception {
// 获取要上传的文件目录
String realPath = request.getSession().getServletContext().getRealPath("/upload");
System.out.println(realPath);
// 创建文件对象
File file = new File(realPath);
if (!file.exists()){
// 路径不存在,创建
file.mkdirs();
}
// 获取文件上传的名称
String fileName = upload.getOriginalFilename();
// 上传文件
upload.transferTo(new File(file,fileName));
Map<String,Object> map = new HashMap<String, Object>();
map.put("code",0);
map.put("msg","");
Map<String,Object> data = new HashMap<String, Object>();
data.put("src",realPath+"/"+fileName);
map.put("data",data);
// 返回json 对象
return map;
}
}