загрузка файла изображения с помощью extjs 4 spring

Question

участник форума У меня возникли некоторые проблемы с загрузкой файлов в 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'
                                },

кнопка загрузки изображения имеет action: '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 выдаёт мне сообщение об ошибке ниже

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

**

Пожалуйста, предложите мне какое-нибудь решение, которое я могу попытаться исправить в ближайшее время.

Answer 1

Ваш контроллер отправляет данные 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);
}

Answer 2

Вы также можете установить свойство SupportedMediaTypes для MappingJacksonHttpMessageConverter с помощью "*/*", вот так:

<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>

Answer 3

Вы генерируете исключение где-то на стороне Java, которое возвращает строку, которую вы видите в ошибке Firebug.Я предлагаю добавить точку останова в блоке catch и изучить, что является исключением.Это даст вам лучшее понимание того, что сломано и как это исправить.

Answer 4

Я столкнулся с подобной проблемой.

Я сузил его до ExtJS, пытающегося декодировать ответ как JSON.Но ответ обернут тегом <pre>.Однако, когда я смотрю в firebug, я просто вижу строку json.Поскольку это обычная запись формы multipart позади браузера сцены, она каким-то образом оборачивает ответ тегом <pre>.

Не уверен, как изменить это поведение браузера.

Answer 5

если вы хотите загрузить файл помимо extjs 4 с помощью Spring, вы можете использовать RestTemplate или Apache HttpClient с multipartData. Spring также предоставляет встроенную возможность для загрузки файла.

полезная ссылка -

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