1、maven工程導(dǎo)入相關(guān)依賴（不是的話下載對(duì)應(yīng)jar包即可）
<!--上傳文件所需依賴-->
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.3</version>
</dependency>
<dependency>
<groupId>commons-io</groupId>
<artifactId>commons-io</artifactId>
<version>2.2</version>
</dependency>
2芥备、到spring-mvc添加相關(guān)上傳配置
<!--文件上傳配置-->
<bean id="multipartResolver"
class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<!-- 上傳文件大小上限冬耿，單位為字節(jié)（10MB） -->
<property name="maxUploadSize">
<value>10485760</value>
</property>
<!-- 請(qǐng)求的編碼格式，必須和jSP的pageEncoding屬性一致萌壳，以便正確讀取表單的內(nèi)容亦镶，默認(rèn)為ISO-8859-1 -->
<property name="defaultEncoding">
<value>UTF-8</value>
</property>
</bean>
3、去前端寫一個(gè)上傳樣式
表單路徑設(shè)置為相應(yīng)訪問路徑袱瓮，并帶上?sid=${session.sid}"缤骨，方便把文件名查到對(duì)應(yīng)的數(shù)據(jù)上（插入sid標(biāo)識(shí)的數(shù)據(jù)）
<form method="post" enctype="multipart/form-data" action="${pageContext.request.contextPath}/student/updateResume?sid=${session.sid}">
<div class="form-group">
</br></br>
<div class="col-sm-6">
<div class="input-group">
<input id='location' class="form-control" placeholder="請(qǐng)選擇簡(jiǎn)歷文件" onclick="$('#i-file').click();">
<label class="input-group-btn">
<input type="button" id="i-check" value="瀏覽文件" class="btn btn-primary" onclick="$('#i-file').click();">
</label>
</div>
</div>
<input type="file" name="resume" id='i-file' accept=".xls, .xlsx" onchange="$('#location').val($('#i-file').val());" style="display: none">
<input type="submit" class="btn btn-primary" value="上傳"/>
</div>
</form>
4、到controller層完善對(duì)應(yīng)處理尺借，并返回個(gè)對(duì)象绊起，方便后續(xù)頁面調(diào)用其屬性
@RequestMapping("/updateResume")
/*@RequestParam(value = "resume",required = false) MultipartFile file中的value值是前面上傳文件框中的name屬性值*/
public String updateResume(Model model,@RequestParam(value = "resume",required = false) MultipartFile file,int sid,HttpSession session) throws IOException {
System.err.println(sid);
//圖片上傳成功后，將圖片的地址寫到數(shù)據(jù)庫
//設(shè)置上傳文件保存地址
String dirPath = "D:\\upload";//保存圖片的本地路徑,必須放在項(xiàng)目文件夾外面燎斩，否則訪問不到
/*這個(gè)配置完要想訪問到虱歪，還需去tomcat里設(shè)置簡(jiǎn)單訪問路徑，打開edit哪個(gè)然后再deployment
里加一個(gè)路徑栅表，右邊Application context是設(shè)置簡(jiǎn)寫笋鄙，即訪問這個(gè)就是訪問左邊的完整路徑*/
File filePath = new File(dirPath);
// 如果保存文件的地址不存在，就先創(chuàng)建目錄
if (!filePath.exists()) {
filePath.mkdirs();
}
//獲取原始文件的拓展名
String originalFilename = file.getOriginalFilename();
//新的文件名字怪瓶，使用uuid隨機(jī)生成數(shù)+原始圖片名字局装，這樣不會(huì)重復(fù)
String newFileName = UUID.randomUUID() + originalFilename;
System.err.println(newFileName);
//封裝上傳文件位置的全路徑，就是硬盤路徑+文件名
File targetFile = new File(filePath, newFileName);
//把本地文件上傳到已經(jīng)封裝好的文件位置的全路徑就是上面的targetFile
file.transferTo(targetFile);
System.err.println("開始調(diào)用");
Student student = studentService.saveResume(sid, newFileName);
if (student != null) {
/*把它放session里*/
session.setAttribute("session", student);
System.err.println(student);
/*送去前端輸出*/
model.addAttribute("student", student);
return "editResume";
}
return "fail";
}
5劳殖、對(duì)應(yīng)service層處理代碼
接口：
Student saveResume(int sid,String newFileName);
實(shí)現(xiàn)類
@Override
public Student saveResume(int sid, String newFileName) {
System.err.println(newFileName);
studentDao.saveResume(sid,newFileName);
/*存完我要找出這個(gè)保存的student對(duì)象傳回去*/
Student student=studentDao.findById(sid);
return student;
}
6铐尚、dao層處理代碼
接口：
public void saveResume(@Param("sid")int sid, @Param("newFileName")String newFileName);
Student findById(int sid);
xml文件：
<update id="saveResume">
update ssmbuild.student
set resume = #{newFileName}
where sid = #{sid}
</update>
<select id="findById" resultType="Student" >
SELECT * from ssmbuild.student where sid=#{sid}
</select>
7、在回顯頁面中通過如下的代碼訪問
<img id="img" width="100%" height="100%" />
var url = "/upload/${student.resume}";
document.getElementById("img").src = url
8哆姻、可在tomcat里設(shè)置訪問路徑如圖所示宣增，方便回顯。其中紅框?yàn)楸镜氐木唧w路徑矛缨， Application context設(shè)置為/upload爹脾，以后在項(xiàng)目中就可以直接/upload訪問到你的保存目錄了
image.png
本例數(shù)據(jù)庫設(shè)置如下
image.png
