用extjs 4 spring上传图片文件

时间:2012-03-20 12:55:01

标签: java spring extjs4 extjs-mvc

论坛成员我在extjs 4和JAVA中上传文件时遇到了一些问题。

我使用的是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-upload-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;
    }

不知道我上面的代码有什么问题。 我的firebug控制台给出了以下错误

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

请建议我一些解决方案,我可以尽快解决我的错误。

5 个答案:

答案 0 :(得分:3)

您的控制器发送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);
}

答案 1 :(得分:0)

如果你想使用Spring上传extjs 4之外的文件,你可以使用RestTemplate或Apache HttpClient和multipartData。 Spring还提供了上传文件的内置工具。

有用的链接 -

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

答案 2 :(得分:0)

我遇到了类似的问题。

我将其缩小到ExtJS,尝试将响应解码为JSON。但响应包含<pre>标记。然而,当我看到萤火虫时,我只看到普通的json字符串。由于它是场景浏览器后面的常规multipart表单帖子,因此以某种方式用<pre>标记包装响应。

不确定如何修改此浏览器行为。

答案 3 :(得分:0)

您还可以使用"*/*"设置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>

答案 4 :(得分:-1)

您在Java端的某处抛出异常,它返回您在Firebug错误中看到的String。我建议在catch块中添加一个断点并调查异常是什么。这将使您更好地了解破坏的内容以及如何修复它。