Spring mvc上傳檔案
- SpringMVC+表單實現檔案上傳
前端程式碼:
<form action="userHead" method="post" enctype="multipart/form-data" >
<input type="file" id="upload" name="upload"/>
<input type="submit" value="up" onclick="imgupload()">
</form>
伺服器端
@Controller
public class FileController {
/**
* 頭像上傳
* @param req
* @param files
* @return2018年9月12日
*/
@RequestMapping(value="/userHead")
public String uptx(HttpServletRequest req,@RequestParam(value="upload") MultipartFile file) {
HttpSession session=req.getSession();
User user=(User) session.getAttribute("user");//獲取使用者資料
String abpath="upload/tx/"+user.getPhone()+"/";//構建儲存相對路徑
String path=req.getServletContext().getRealPath(abpath);//獲取絕對路徑
String filename=file.getOriginalFilename();//獲取檔名
File thisfile=new File(path,filename);
if(!thisfile.exists()) {
thisfile.mkdirs();
}
try {
file.transferTo(thisfile);
} catch (IllegalStateException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
Return “home”;
}
}
利用表單上傳圖片到伺服器端 用於前端介面為jsp頁面的情況,利用model即可向jsp頁面返回訊息
@RequestMapping(value="/userHead")
public String uptx
(HttpServletRequest req,@RequestParam(value="upload") MultipartFile file)
控制器為userHead;
HttpServletRequest req此引數用於下面獲取session中的資料
@RequestParam(value="upload") MultipartFile file
‘MultipartFile 封裝了上載檔案的所有資訊
@RequestParam是對於方法引數的註解,將表單中對應key的值注入引數bean
HttpSession session=req.getSession();
User user=(User) session.getAttribute("user");//獲取使用者資料
String abpath="upload/tx/"+user.getPhone()+"/";//構建儲存相對路徑
String path=req.getServletContext().getRealPath(abpath);//獲取絕對路徑
String filename=file.getOriginalFilename();//獲取檔名
File thisfile=new File(path,filename);
if(!thisfile.exists()) {
thisfile.mkdirs();
}
構建檔案路徑 如果資料夾不存在 就建立檔案
Abpath為相對路徑,再前端 我們使用域名+檔案在伺服器端的相對路徑來讀取圖片資源
file.transferTo(thisfile);
呼叫multipartFile物件的transferTo()方法把檔案存入對應的檔案
SPringMVC+ajax實現檔案上傳
常用於移動端和伺服器端的互動,非同步上傳檔案
以下程式碼使用ajax上傳檔案成功後將檔案資源返回客戶端
Html
<img alt="頭像" src="#" id="txs" style="width:100px;height:100px">
<form action="userHead" method="post" >
<input type="file" id="upload" name="upload"/>
<input type="button" value="up" onclick="imgupload()">
</form>
Ajax
function imgupload(){
var formData=new FormData();
formData.append("upload",$("#upload")[0].files[0]);
$.ajax({
url: 'userHead',
type: 'POST',
data: formData,
async: true,
cache: false,
contentType: false,
processData: false,
success: function (returndata) {
$("#txs").attr("src",returndata)
},
error: function (returndata) {
alert(returndata);
}
});
}
Ajax使用FormData物件模擬表單物件上傳
所以我們取出一個file物件
把它以鍵值對的形式新增到formData物件中
上載到伺服器端
SpringMVC
@Controller
public class FileController {
/**
* 頭像上傳
* @param req
* @param files
* @return2018年9月12日
*/
@RequestMapping(value="/userHead")//,consumes = "multipart/form-data"
@ResponseBody
public String uptx(HttpServletRequest req,@RequestParam(value="upload") MultipartFile file) {
HttpSession session=req.getSession();
User user=(User) session.getAttribute("user");//獲取使用者資料
String abpath="upload/tx/"+user.getPhone()+"/";//構建儲存相對路徑
String path=req.getServletContext().getRealPath(abpath);//獲取絕對路徑
String filename=file.getOriginalFilename();//獲取檔名
File thisfile=new File(path,filename);
if(!thisfile.exists()) {
thisfile.mkdirs();
}
try {
file.transferTo(thisfile);
} catch (IllegalStateException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return abpath+filename;
}
}