Extjs和Swing回调问题与文件上传

时间:2014-11-17 17:47:43

标签: json swing extjs upload callback

我正在根据本教程构建应用程序:
    http://loianegroner.com/2011/07/extjs-4-file-upload-spring-mvc-3-example/

我的客户端代码如下所示

        Ext.applyIf(me, {
        items: [
            {
                xtype: 'form',
                margins: '5 5 5 5',
                region: 'north',
                height: 52,
                bodyPadding: 10,
                title: 'Filters',
                standardSubmit: false,
                dockedItems: [
                    {
                        xtype: 'toolbar',
                        dock: 'top',
                        items: [
                            {
                                xtype: 'filefield',
                                itemId: 'uploader',
                                width: 500,
                                hideLabel: true,
                                name: 'file'
                            },
                            {
                                xtype: 'tbseparator'
                            },
                            {
                                xtype: 'button',
                                handler: function(button, e) {
                                    var form = this.up('form').getForm();

                                    if(form.isValid()){
                                        form.submit({
                                            url: 'http://localhost:8080/ItsCorrectionSvc/upload.action.json',
                                            waitMsg: 'Uploading and processing your file . . .',
                                            success: function(form, action) {
                                                //Ext.Msg.alert('Success', 'Your file has been uploaded\n Result is ' + o.result.file);
                                                alert('Success');
                                            },
                                            failure: function(form, action){
                                                alert("Callback Failed : form is " + form + "  action is " + action.value);
                                            }
                                        });
                                    }


                                },
                                id: 'submitFileButton',
                                itemId: 'submitButton',
                                text: 'Submit'
                            },

我的服务器端是:

    @Controller
@RequestMapping(value = "/upload.action")
public class FileUploadController {

@RequestMapping(method = RequestMethod.POST)
@ResponseBody 
public String create(FileUploadBean uploadItem, BindingResult result){

    ExtJSFormResult extjsFormResult = new ExtJSFormResult();

    if (result.hasErrors()){
        for(ObjectError error : result.getAllErrors()){
            System.err.println("Error: " + error.getCode() +  " - " + error.getDefaultMessage());
        }

        //set extjs return - error
        extjsFormResult.setSuccess(false);

        return extjsFormResult.toString();
    } else {
        CommonsMultipartFile uploadedFile = uploadItem.getFile();
        try {
            InputStream io = uploadedFile.getInputStream();
            BufferedReader reader = new BufferedReader(new InputStreamReader(io));
            StringBuilder out = new StringBuilder();
            String line;
            while ((line = reader.readLine()) != null) {
                out.append(line);
                out.append("\n");
            }
            System.out.println(out.toString());   //Prints the string content read from input stream
            reader.close();

        } catch (IOException e) {
            e.printStackTrace();
        }

    }

    // Some type of file processing...
    System.err.println("-------------------------------------------");
    System.err.println("Test upload: " + uploadItem.getFile().getOriginalFilename());
    System.err.println("-------------------------------------------");

    //set extjs return - success
    extjsFormResult.setSuccess(true);

    return extjsFormResult.toString();
}

当我运行这个时,我可以看到文件上传到我的服务器,服务器正确打印出文件的内容,所以我成功上传了文件。但是,当我将extjsFormResult传递回客户端时,它总是失败。我还尝试传回一个硬编码的“{success:true}”字符串,以确保返回的对象符合我的预期。

我也尝试在我的web.xml中添加一个json过滤器

<filter>
    <filter-name>jsonpCallbackFilter</filter-name>
    <filter-class>org.springframework.web.filter.DelegatingFilterProxy</filter-class>
</filter>
<filter-mapping>
    <filter-name>jsonpCallbackFilter</filter-name>
    <url-pattern>*.json</url-pattern>
</filter-mapping>

然后将我的客户端中的映射更改为:

url: 'http://localhost:8080/ItsCorrectionSvc/upload.action.json',

这应该确保我的响应是格式正确的json对象。

在每种情况下,客户端都无法进行回调。我收到警告框告诉我回调失败并且操作未定义。有谁知道为什么我的回调失败了?

感谢您的协助。

1 个答案:

答案 0 :(得分:0)

您可以随时使用hashmap返回结果成功,而不是使用ExtJSFormResult。@ResponseBody下面的内容将处理返回结果格式(这里是json)。

Map results = new HashMap();
results.put("succes", true);
return results;

请尝试一次。希望它可以帮到你。