<script type="text/javascript">
var formFile = document.getElementById('file').files[0];
var formData = new FormData();
formData.append('file', formFile);
formData.append('video_duration', Math.floor(aud.duration));
var url = "api 호출 url";
$.ajax({
url: url,
type: "POST",
dataType: "json",
data: formData,
processData: false,
contentType: false,
success: function(data) {
console.log(data);
}
}, error: function(request,status,error) {
console.log("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
}
});
</script>
INPUT type file로 파일 업로드 구현
스크립트
//script
$(document).ready(function() {
$('#file').change(function(){
var fileInput = document.getElementById('file');
var file = fileInput.files[0];
var reader = new FileReader();
reader.onload = function() {
var aud = new Audio(reader.result);
aud.onloadedmetadata = function(){
// 동영상 파일의 재생 길이(초)
console.log(aud.duration);
// input file을 가져옴
var formFile = document.getElementById('file').files[0];
console.log(formFile);
var formData = new FormData();
formData.append('file', formFile);
formData.append('video_duration', Math.floor(aud.duration));
var url = "API 호출 URL";
$.ajax({
url: url,
type: "POST",
dataType: "json",
data: formData,
processData: false,
contentType: false,
success: function(data) {
console.log(data);
}, error: function(request,status,error) {
console.log("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
}
});
}
}
reader.readAsDataURL(file);
});
JSP
//JSP
컨트롤러
//CONTROLLER
@ResponseBody
@RequestMapping(value="해당 URL", method=RequestMethod.POST)
public Response testUpload(
// script에서 append한 객체를 map으로 받음
@RequestParam Map map,
// multipart file을 part로 받음
@RequestPart(value="file", required=false) MultipartFile file,
HttpSession session,
HttpServletRequest request) throws JsonProcessingException {
DataMap dataMap = new DataMap(map);
dataMap.put("file", file);
logger.debug("dataMap {} ", dataMap);
DataMap result = service.insetVideoTest(dataMap);
return ResponseUtil.responseResult(result);
}