前端使用Ajax上傳圖片到后台

function uploadpic() {
    var formData = new FormData();
 var file = document.getElementById('file').files[0];
 // var id_token = $('#id_token').val();
 formData.append("file", file);
 // formData.append("id_token", id_token);
 $.ajax({
        url: "${path }/user/uploadESignatureImg",
 type: "post",
 data: formData,
 dataType: "json",
 // cache: false,//上傳文件無需緩存
 processData: false,//用於對data參數進行序列化處理 這里必須false
 contentType: false, //必須*/
 success: function (data) {
           // console.log(data);
 $("#dianziqianmingImg").attr('src', '${path }' + data.msg).removeAttr('style').attr('style', 'width: 100px;height: 100px');
 $("#dianziqianmingPath").val(data.msg)
        }
    });} 

 

 

<form id="form1" enctype="multipart/form-data">
    <input type="file" id="file" name="imgfile" onchange="uploadpic()">
    <input type="hidden" name="dianziQianming" id="dianziqianmingPath"/>
</form>

 

 

@ResponseBody
@RequestMapping("/uploadESignatureImg")
public Object uploadESignatureImg(@RequestParam("file") MultipartFile file, HttpServletRequest request, HttpServletResponse response) {
    String filePath = uploadESignature(file);

    return renderSuccess(filePath);
}