Ошибка при загрузке изображения в java через ajax и отображении его на front-end, помогите мне - PullRequest
0 голосов
/ 12 сентября 2018

Я пытаюсь загрузить изображение в сервлет в java, используя jQuery ajax.файл загружается правильно, и проблема возникает, когда я возвращаю тот же путь к ответу для отображения изображения на экране.

код сервлета:

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    String returnPath = "";
    DiskFileItemFactory factory = new DiskFileItemFactory();
    ServletFileUpload fileUpload = new ServletFileUpload(factory);
    try {
        List<FileItem> list = fileUpload.parseRequest(request);
        for(FileItem items : list) {
            String fileName = new File(items.getName()).getName();
            String filePath = request.getContextPath()+File.separator+"images";
            if(!new File(filePath).exists()) {
                new File(filePath).mkdir();
            }
            System.out.println(System.getProperty("catalina.home"));
            String storeFile = filePath+File.separator+fileName;
            returnPath = storeFile;
            if(new File(storeFile).exists()) {
                System.out.println("already exists");
            }else if(!new File(storeFile).exists()) {
                items.write(new File(storeFile));
                System.out.println("uploaded");
            }
        }
    } catch (Exception e) {
        e.printStackTrace();
    }
    response.setContentType("text/plain");
    response.getWriter().write(returnPath);
}

html

$(document).ready(function(){
        $('#submitBtn').click(function(){
            var form = $('#myForm')[0];
            var formData = new FormData();
            formData.append("simpleFile",document.getElementById('file').files[0])
            $.ajax({
                type:'POST',
                enctype:'multipart/form-data',
                url:'upload',
                data:formData,
                processData:false,
                contentType :false,
                cache:false,
                success:function(response){
                    console.log(response);
                    alert(response);
                    $('#myImg').attr('src',response);
                },
                error:function(response){
                    console.log(response);
                    alert(response);
                }
            });
        });
    });

Консоль

Tulips.jpg:1 GET http://localhost:8080/ImageUploadAjax/images/Tulips.jpg 404 ()
...