(檔案上傳二)SpringBoot+JQ檔案上傳
1、在做web項目的過程中，主要是寫接口和wap、web或者是app工程師進行互動，我們互動的主要内容是資料的互動，說白一點，大緻類似于字元串的交換。
2、個人中心或者後端管理功能難免會有一些個檔案上傳的功能，這裡的話就不是簡簡單單的字元串互動的問題了。但是對于計算機來說，不管是什麼，都是0或者1的二進制資料。
3、以圖檔上傳為例我們結合SpringBoot和JQ進行檔案上傳。
bootDemo下載下傳位址 ：https://pan.baidu.com/s/1bPNjjy1K0NbeyKgMKITDtg 密碼：2j6n
主要代碼如下：
html部分：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jq檔案上傳</title>
</head>
<body>
<div id="fileDiv">
<input type="file" id="myFile" name="file"/>
<button id="upLoadBtn">上傳</button>
</div>
</body>
<script type="text/javascript" src="jquery2.0.0.min.js" ></script>
<script type="text/javascript" src="fileUpLoad.js"></script>
</html>
JS部分：
var imgUpLoadUrl = "/img/upload.do";
$(function(){
$("#upLoadBtn").click(function(){
if(checkImg()){
upLoadImg();
}
});
})
//校驗函數
function checkImg(){
//擷取file對象
var file = $("#myFile").val();
if(!/.(gif|jpg|jpeg|png|GIF|JPG|bmp)$/.test(file)){
layer.msg("圖檔類型必須是.gif,jpeg,jpg,png,bmp中的一種",{icon: 2,time: 2000});
return false;
}else{
//大小校驗
if(($("#myFile")[0].files[0].size.toFixed(2))>=(500*1024)){
layer.msg("請上傳小于500KB的圖檔",{icon: 2,time: 2000})
return false;
}
}
return true;
}
//上傳函數
function upLoadImg(){
var imgEle = $("#myFile")[0].files[0];
var formdata = new FormData();
formdata.append('file',imgEle);
$.ajax({
url:imgUpLoadUrl,
type:'post',
data:formdata,
cache: false,
processData: false,
contentType: false,
async: false
}).done(function(res) {
//自行處理
console.log(res);
}).fail(function(res) {
//自行處理
console.log(res);
});;
}
JAVA部分：
package com.file.upload.controller;
import java.io.File;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;
@RestController
@RequestMapping("/img")
public class ImgUpLoadCon {
@PostMapping("/upload.do")
public String uploadImg(MultipartFile file) {
InputStream in = null;
FileOutputStream fos = null;
//設定每次讀取檔案時的大小
byte[] bytes = new byte[2048];
try {
//擷取檔案的輸入流 , 該類有個方法是直接将檔案持久化的 , 但是在windows在可能會出現路徑過長的問題
in = file.getInputStream();
int len = 0;
//檔案持久化路徑 , 就是上傳之後存放該檔案的位址
String filePathStr = "D:/data/";
//這裡擷取的是檔案名 , 一般實際項目中都是自己生成檔案路徑記錄到資料庫中 , 但不是所有 ,此處不用
String fileName = file.getOriginalFilename();
//對路徑常見 File 對象進行操作
File filePath = new File(filePathStr);
//建立路徑
if(!filePath.exists()) {
filePath.mkdirs();
}
//擷取輸出流 , 格式自己做适配 根據MiME
fos = new FileOutputStream(filePathStr+"test.jpg");
//将讀取到的内容寫入到指定檔案中
while((len=in.read(bytes))!=-1) {
fos.write(bytes, 0, len);
}
//flush 輸出流
fos.flush();
} catch (IOException e) {
e.printStackTrace();
}finally {
try {
//關閉輸出流
if(null!=fos) {
fos.close();
}
//關閉輸入流
if(null!=in) {
in.close();
}
} catch (IOException e) {
e.printStackTrace();
}
}
//反回資料 , 這裡可以反回自定義類型 , 這個略過
return "{'code':'1','msg':'上傳完成'}";
}
}
SpringBoot+JQ上傳完成。
![Java小案例——随機數猜測随機數猜測[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)