브라우저는 서블릿

Question

내가 mutliple 파일의 jquery.ajax 포스트를 수행 한 후 서블릿에 의해 반환되는 일부 HTML을로드하는 데 문제가 있어요에 jquery.ajax의 POST를 수행 한 후 HTML 응답을로드 할 수 없습니다.

파일 (사진)을 업로드 할 수 있습니다. 나는 사진의 일부 처리를 수행하고 사진에서 일부 메타 데이터를 추출하는 서블릿을 가지고있다. 사진을 처리 한 후 추출 된 메타 데이터 중 일부를 JSP로 전달하여 결국 브라우저로 반환하려고합니다.

이 모든 것이 정상적으로 작동합니다. 내 데이터로 요청 개체를로드하고이를 내 JSP로 리디렉션합니다. 그러나 ... JSP가 브라우저에 응답 할 때마다 페이지가로드되지 않습니다.

나는 JSP 제대로 HTML 나는 그것을 원하는 방식으로 생성하는 것을 볼 수 있으며, 브라우저가 응답 HTML 텍스트를 가져 불을 지르고 사용 ... 그냥 페이지를로드하지 않습니다. 페이지는 원래 있던 위치에 머물러 있기 때문에 Firebug에서 응답의 HTML 텍스트를 볼 수 있습니다.

어떤 아이디어가 문제 일 수 있으십니까? 여기에 ... 관련 코드의 일부입니다 제가 위에서 언급 한 바와 같이

서블릿에 파일을 업로드

자바 스크립트 기능 ...

function uploadPictures() { 
    var input = document.getElementById('filesToUpload'); 
    var fileList = []; 
    var files = new FormData(); 

    for(var i = 0; i < input.files.length; i++) {  
     files.append("file", input.files[i]); 
    } 

    $.ajax({ 
     type  : "POST", 
     url   : "/uploadPhotos", 
     data  : files, 
     dataType : "HTML", 
     processData : false, 
     contentType : false 
    }); 
} 

서블릿 코드

@MultipartConfig 
public class UploadPhotosServlet extends HttpServlet { 

    @Override 
    public void doPost(HttpServletRequest request, HttpServletResponse response) throws IOException, ServletException { 
     String url = "/uploadForm.jsp"; 
     RequestDispatcher dispatcher = 
      getServletContext().getRequestDispatcher(url); 
     String basePath = getInitParameter("photosRoot"); 
     HashMap<String,String> files = new HashMap<String,String>(); 

     java.util.Collection<Part> parts = request.getParts(); 
     for (Part part : parts) { 
      String filename = getFilename(part); 
      InputStream fileContent = part.getInputStream(); 

      OutputStream outFile = new FileOutputStream(new File(basePath + "screen/" + filename)); 
      int read = 0; 
      byte[] bytes = new byte[1024]; 

      while((read = fileContent.read(bytes)) != -1) { 
       outFile.write(bytes, 0, read); 
      } 

      fileContent.close(); 
      outFile.flush(); 
      outFile.close(); 

      File img = new File(basePath + "screen/" + filename); 
      File thumb = new File(basePath + "screen/thumbnails/" + filename); 

      try { 
       Metadata metadata = ImageMetadataReader.readMetadata(img); 

       for(Directory directory : metadata.getDirectories()) { 
        if(directory.containsTag(ExifSubIFDDirectory.TAG_DATETIME_ORIGINAL)) { 
         Date date = directory.getDate(ExifSubIFDDirectory.TAG_DATETIME_ORIGINAL); 
         SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); 
         files.put(filename, sdf.format(date)); 
         break; 
        } else if(directory.containsTag(ExifIFD0Directory.TAG_DATETIME)) { 
         Date date = directory.getDate(ExifIFD0Directory.TAG_DATETIME); 
         SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); 
         files.put(filename, sdf.format(date)); 
         break; 
        } 
       } 

       BufferedImage buffImg = ImageIO.read(img); 
       BufferedImage buffThumb = Scalr.resize(buffImg, 150); 

       ImageIO.write(buffThumb, "jpg", thumb); 
      } catch (IOException e) { 
       e.printStackTrace(); 
      } catch (ImageProcessingException e) { 
       e.printStackTrace(); 
      } 
     } 

     request.setAttribute("files", files); 
     dispatcher.forward(request, response); 
    } 

    private static String getFilename(Part part) { 
     for (String cd : part.getHeader("content-disposition").split(";")) { 
      if (cd.trim().startsWith("filename")) { 
       String filename = cd.substring(cd.indexOf('=') + 1).trim().replace("\"", ""); 
       return filename.substring(filename.lastIndexOf('/') + 1).substring(filename.lastIndexOf('\\') + 1); // MSIE fix. 
      } 
     } 
     return null; 
    } 
} 

의 JSP 그 리디렉션은 (uploadForm.jsp)로 잘 생성됩니다. Firebug는 서블릿 호출의 응답에 HTML 코드를 표시합니다 ... 그러나 브라우저는 업로드 양식이있는 페이지에 머물러 있습니다.

도움 주셔서 감사합니다.

Answer 1

의 success 함수에 window.location를 사용할 수 있습니다.

<form action="/uploadPhotos" method="post" enctype="multipart/form-data"> 
    <input type="file" multiple name="filesToUpload" /> 
    <button type="submit">Upload</button> 
</form> 

Answer 2

아약스는 아약스를 사용하여 전체 목적, 당신의 페이지를 다시로드하지 않을. 아약스 응답 결과 (성공 또는 실패)

에 관계없이 돌아올 후 여기에 문서화 아약스의 http://api.jquery.com/jQuery.ajax/

complete 콜백이 항상라고하지만, 당신은 아약스의 complete 설정을 사용하여 다시로드 페이지를 강제 할 수 함께 넣어, 당신은 같은 일을 할 것입니다 : 당신이 원하는 것이 아니다

$.ajax({ 
    type  : "POST", 
    url   : "/uploadPhotos", 
    data  : files, 
    dataType : "HTML", 
    processData : false, 
    contentType : false, 
    complete: function() { 
     location.reload(); //or other browser specific reload method 
    } 
}); 

complete 경우, 대신 success 또는 error를 사용하려고합니다. 반환 HTML 상태 코드가 2xx 또는

error 접수대는 반환 HTML 상태 코드가 4XX 또는

5XX는 사용자의 필요에 따라 그것을 활용하는 경우 호출 될 때

success 가 호출된다

Answer 3

AJAX 메서드는 페이지를 새로 고치지 않아야합니다. 당신이 원하는 경우에 당신은 당신이 정말로 당신이 현재하고있는 것보다 훨씬 간단 원하는처럼 보이는 ajax 요청

$.ajax({ 
    type  : "POST", 
    url   : "/uploadPhotos", 
    data  : files, 
    dataType : "HTML", 
    processData : false, 
    contentType : false, 
    success: function(){ 
     window.location = "uploadForm.jsp"; 
    } 
});