圖像文件上傳與extjs 4春天

論壇成員我在extjs 4和JAVA文件上傳有一些問題。圖像文件上傳與extjs 4春天

我使用extjs4和上傳表單代碼

{ 
            xtype: 'filefield', 
            margin: '10 0 0 5', 
            width: 296, 
            fieldLabel: 'Image', 
            emptyText: 'Select Company logo...', 
            id: 'cmplogo', 
            itemId: 'cmplogo', 
            name: 'cmplogo', 
            labelWidth: 70 
           }, 
           { 
            xtype: 'button', 
            margin: '10 0 0 90', 
            width: 89, 
            text: 'Upload Image', 
            action: 'btn-upload-img' 
           },

按鈕上傳圖像具有行動： 'BTN-上傳-IMG' 與功能如下

fileUpload: function(btn) { 
     var win = btn.up('window'); 
     var form = win.down('form').getForm(); 
     alert('VALUE IS :'+form.getValues()); 

     if(form.isValid()){ 
      form.submit({ 
       url : 'company/UploadFile.action', 
       waitMsg: 'Uploading your file...', 
       success: function(fp, o) { 
        Ext.Msg.alert('Success', 'Your file has been uploaded.'); 
       } 
      }); 
     } 
    },

和定義我的java控制器有以下功能代碼

@RequestMapping(value = "/company/UploadFile.action") 
    public @ResponseBody 
    Map<String, ? extends Object> uploadFile(UploadItem uploadItem, BindingResult result) throws Exception { 
     System.out.println("QUERY TO UPLOAD FILE"); 
     try { 
      if(result.hasErrors()) { 
       for(ObjectError error: result.getAllErrors()) { 
        System.err.println("Error: "+error.getCode()+" - "+error.getDefaultMessage()); 
       } 
      } 
      else 
      { 
       MultipartFile file = uploadItem.getFileData(); 
       String fileName = null; 
       InputStream inputStream = null; 
       OutputStream outputStream = null; 
       if(file.getSize() > 0) { 
        inputStream = file.getInputStream(); 
        if(file.getSize() > 10000) { 
         System.out.println("FILE SIZE:::"+file.getSize()); 
        } 
        System.out.println("SIZE ::"+file.getSize()); 
        fileName = "E:\\images\\"+file.getOriginalFilename(); 
        outputStream = new FileOutputStream(fileName); 
        System.out.println("FILE NAME AND PATH IS ::"+fileName); 
        System.out.println("FILENNAME ::"+file.getOriginalFilename()); 

        int readBytes = 0; 
        byte[] buffer = new byte[10000]; 
        while((readBytes = inputStream.read(buffer, 0, 10000)) !=-1) { 
         outputStream.write(buffer, 0, readBytes); 
        } 
        outputStream.close(); 
        inputStream.close(); 
       } 
      } 


     } catch (Exception e) { 
      return getModelMapError("Error trying to read city"); 
     } 
     return null; 
    }

不要知道我上面的代碼有什麼問題。 我螢火控制檯給我下面的錯誤

**uncaught exception: You're trying to decode an invalid JSON String: <pre>{"message":"Error trying to read city","success":false}</pre>**

請建議我一些解決方案，我可以嘗試讓我的錯誤很快得到解決。

來源

2012-03-20 Yogendra Singh

是你能找出你的情況的解決方案？ – pacman 2012-04-10 16:38:20

您的控制器發送JSON數據（application/json）作爲extjs不支持的響應。嘗試設置你的響應內容類型：「text/html」，它會正常工作。 @ResponseBody更改到ResponseEntity

@RequestMapping(value = "/company/UploadFile.action") 
public ResponseEntity<String> Map<String, ? extends Object> uploadFile(UploadItem uploadItem, BindingResult result) throws Exception { 
    HttpHeaders responseHeaders = new HttpHeaders(); 
    responseHeaders.add("Content-Type", "text/html; charset=utf-8"); 

    // your controller logic goes here 

    return new ResponseEntity<String>(response, responseHeaders, HttpStatus.OK); 
}

來源

2012-04-17 08:03:29 digz6666

我遇到了不同的服務器（如Pyramid使用的粘貼服務器）的相同問題，以及digz6666的答案（內容類型部分）在http://www.sencha.com/forum/showthread中得到確認（並進一步解釋） .PHP？120201-提交-A-形狀似乎要被誤解釋最響應型＆p = 557527＆viewfull = 1＃post557527 – Walter 2012-04-23 19:15:37

如果你想使用Spring除extjs 4以外的文件上傳，你可以使用RestTemplate或Apache HttpClient和multipartData。 Spring還提供內置的工具來上傳文件。

有用的鏈接 -

http://blog.springsource.org/2009/03/27/rest-in-spring-3-resttemplate/

來源

2012-03-20 13:15:59

我可以上傳圖片，但不知道爲什麼我的Image xtype無法顯示圖片上傳。使用螢火蟲，我可以看到圖像上傳和完美讀取。但爲什麼它不顯示對我來說是一個大問題 – 2012-03-21 08:54:41

您是否能夠在「E：\\ images \\ YOUR_FILE_NAME」中保存文件？ – 2012-03-21 10:09:13

是的，我可以保存我的圖片上傳到E：目錄中的圖像文件夾 – 2012-03-21 11:03:13

-1

你在Java的一面，這回是你所看到的螢火蟲錯誤字符串某處拋出異常。我建議在catch塊中添加一個斷點並調查異常情況。這會讓你更好地理解什麼是壞的，以及如何解決它。

來源

2012-03-20 14:13:56 CodeChimp

無法理解我剛剛嘗試實現http://loianegroner.com/2011/07/extjs-4-file-upload-spring-mvc-3-example/教程時出了什麼問題。但我無法使它工作 – 2012-03-21 05:47:25

@CodeChimp：他的響應包含錯誤的事實在這裏不是問題，這是事實上，JavaScript中的處理不正確（ExtJS）。 – Walter 2012-04-23 19:19:38

我遇到了類似的問題。

我將其縮小爲ExtJS，試圖將響應解碼爲JSON。但是響應包裹着<pre>標籤。但是，當我看着螢火蟲，我只看到普通的json字符串。由於它是一個常規的multipart表單文章，在幕後瀏覽器以某種方式包裝了<pre>標籤的響應。

不確定如何修改此瀏覽器行爲。

來源

2012-04-10 16:37:33 pacman

您還可以設置與"*/*" MappingJacksonHttpMessageConverter的supportedMediaTypes財產，就像這樣：

<mvc:annotation-driven> 
    <mvc:message-converters> 
     <bean class="org.springframework.http.converter.StringHttpMessageConverter" /> 
     <bean class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter"> 
      <property name="supportedMediaTypes" value="*/*" /> 
     </bean> 
    </mvc:message-converters> 
</mvc:annotation-driven>

來源

2013-07-18 04:51:52

圖像文件上傳與extjs 4春天

回答

相關問題