1. 程式人生 > >springmvc_ajax異步上傳文件(基於ajaxfileupload.js)

springmvc_ajax異步上傳文件(基於ajaxfileupload.js)

indexof pin req 異步上傳 rto tip https alert div

引入js

  <script th:src="@{/js/ajaxfileupload.js}"></script>

html

<tr>
        <td>附件:</td>
        <td>
             <input type="hidden" id="insertcyefuji"  name="fuji" />
             <input type="file"  id="uploadcyefuji"  name="file" />
        </
td> </tr>

js代碼-----選擇完文件後自動上傳

$(‘input[id="uploadcyefuji"]‘).change(function(e){
              var formData = new FormData();
                formData.append(‘file‘, $(‘#uploadcyefuji‘)[0].files[0]);
                $.ajax({
                    url: ‘/fileUpload‘,
                    type: ‘POST‘,
                    cache: false,
                    data: formData,
                    processData: false,
                    contentType: false
                }).done(function(res) {
                    alert("上傳成功")
                }).fail(function(res) {
                    alert("上傳失敗");
                });
     
 })

controller後臺代碼

 1 /**
 2      * 實現文件上傳
 3      * @throws IOException 
 4      * @throws IllegalStateException 
 5      * */
 6     @RequestMapping(value="fileUpload",method = RequestMethod.POST)
 7     @ResponseBody 
 8     public String fileUpload(HttpServletRequest req,MultipartFile file) throws
IllegalStateException, IOException{ 9 if(file.getOriginalFilename()==null||file.getOriginalFilename().equals("")){ 10 System.err.println("為空++++"); 11 return ""; 12 }else{ 13 String picName = UUID.randomUUID().toString(); 14 // 獲取文件名 15 String oriName = file.getOriginalFilename(); 16 System.err.println(oriName+"圖片名字"); 17 // 獲取圖片後綴 18 String extName = oriName.substring(oriName.lastIndexOf(".")); 19 System.err.println("後綴名字"+extName); 20 if(extName.equals(".jpg") || extName.equals(".JPG") ||extName.equals(".png") || extName.equals(".PNG")){ 21 String path = req.getSession().getServletContext().getRealPath("/"); 22 System.out.println("path="+path); 23 24 file.transferTo(new File(path+"upload/"+picName + extName)); 25 //user.setUsername(picName + extName); 26 //m.addAttribute("fileName"+count, picName + extName); 27 //count--; 28 //list.add(user); 29 30 // 設置圖片名到商品中 31 System.err.println("上傳圖片完成"); 32 return "上傳成功"; 33 }else { 34 System.err.println("格式不對"); 35 return "格式不對"; 36 37 } 38 } 39 }

springmvc_ajax異步上傳文件(基於ajaxfileupload.js)