vueフロントエンドは画像ファイルを転送し、バックエンドは受信する。
1099 ワード
vue端
1、メール.jsファイルに追加する
1、メール.jsファイルに追加する
const upload = axios.create({
// url
baseURL: 'http://localhost:8096/reconciliation/',
timeout: 50000,
});
Vue.prototype.$upload = upload;
2、ファイルをアップロードしたいvueファイルの中でuploadImg(file){
var _this = this;
var formData = new FormData();
formData.append("file", file.raw);
_this.$upload.post("file/upload", formData)
.then(res => {
_this.$message(res.data.userInfo, 'success');
}).catch(data=>{
console.log(data);
})
}
3、楽屋でcontroller中@RestController
@RequestMapping("file")
public class FileDataController {
@RequestMapping(value = "/upload", method = RequestMethod.POST)
public String handleFileUpload(@RequestParam("file") MultipartFile file) throws IOException {
// base64
BASE64Encoder encoder = new BASE64Encoder();
String imgData = encoder.encode(file.getBytes());
String url = null;
//
return url1;
}
}