Почему при загрузке файла с использованием jquery с использованием Spring mvc я получаю сообщение об ошибке типа Bad Request?

java jquery spring-mvc

141 просмотра

1 ответ

Когда я использую Jquery с пружинным MVC, я получаю сообщение об ошибке на стороне браузера «Плохой запрос», и контроль не идет к контроллеру. Пока я использую простую форму и отправляю запрос тому же контроллеру, он идет. Ниже мой код, пожалуйста, скажите мне, где я иду не так?

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>

 <script src="files/jquery-1.10.2.js"></script>
    <script src="files/jquery-1.10.2.min.js"></script>
<script type="text/javascript">

var isJpg = function(name) {
    return name.match(/jpg$/i)
};

var isPng = function(name) {
    return name.match(/png$/i)
};

$(document).ready(function() {
    var file = $('[name="file"]');
    var imgContainer = $('#imgContainer');

    $('#btnUpload').on('click', function() {
        var filename = $.trim(file.val());

        if (!(isJpg(filename) || isPng(filename))) {
            alert('Please browse a JPG/PNG file to upload ...');
            return;
        }

        $.ajax({
            url: 'FileData.htm',
            type: "POST",
            data: new FormData(document.getElementById("fileForm")),
            enctype: 'multipart/form-data',
            processData: false,
            contentType: false
          }).done(function(data) {
              imgContainer.html('');
              var img = '<img src="data:' + data.contenttype + ';base64,'
                  + data.base64 + '"/>';

              imgContainer.append(img);
          }).fail(function(jqXHR, textStatus) {
              //alert(jqXHR.responseText);
              alert('File upload failed ...');
          });

    });

    $('#btnClear').on('click', function() {
        imgContainer.html('');
        file.val('');
    });
});

</script>

</head>
<body>
 <!-- <form name="dlgContent" action="FileData.htm" id="dlgcon"  enctype="multipart/form-data" method="POST">
 <input type="file" name="excelfile"/>
 <input type="submit"/>
 </form> -->


 <div>
<form id="fileForm">
    <input type="file" name="file" />
    <button id="btnUpload" type="button">Upload file</button>
    <button id="btnClear" type="button">Clear</button>
</form>
<div id="imgContainer"></div>
</div>


</body>
</html>

И мой класс контроллеров в весеннем отображении приведен ниже

@RequestMapping(value="/FileData.htm", method = RequestMethod.POST)
    public void FileData(Model model, @RequestParam CommonsMultipartFile[] excelfile, HttpServletRequest request, HttpServletResponse response){
        System.out.println("bhjsbfjhsbfbdesfbsfb");
        response.setContentType("application/json");
        FileData fd = new FileData();
        //Map<String, String> data = fd.submitFileData(excelfile);

        Gson gson = new Gson();
    //  String values = gson.toJson(data);

        try {
            //response.getWriter().write(values);
            //System.out.println(values);
        } catch (Exception e) {
            // TODO: handle exception
            e.printStackTrace();
        }
    }

Благодарю.

Автор: user5747838 Источник Размещён: 08.11.2019 11:14

Ответы (1)


0 плюса

На самом деле вы отправляете Json, а не HTML, вы должны использовать @ResponseBody

    @RequestMapping(value="/upload", method = RequestMethod.POST)
public @ResponseBody
FileData upload(MultipartHttpServletRequest request,
                            @RequestParam String albumName,
                             HttpServletResponse response) {
  Iterator<String> itr =  request.getFileNames();

    //others code here

Также не забывайте !! чтобы сконфигурировать многокомпонентные данные, плюс отправить обратно Object с помощью jackson lib в функцию jquery done, чтобы работать. Gson lib не подходит для использования с @ResponseBody, вместо этого мы используем Gson с RestTemplate.

Автор: Ali.Mojtehedy Размещён: 21.08.2016 01:05
Вопросы из категории :
32x32