2016-05-18 5 views
0

Ich versuche gerade, eine Java-Webanwendung zu entwickeln, die für Google Chrome optimiert ist (4 und höher).AJAX leitet nach dem Hochladen der Datei nicht auf eine Webseite um - POST-Methode

Ich möchte, dass der Benutzer in der Lage ist, mehrere Dateien auszuwählen, auf einen Server hochzuladen (über ein Formular auf einer Webseite namens uploadForm) und nach dem Hochladen automatisch auf eine andere Webseite umzuleiten (Upload genannt)).

Daher habe ich eine JSP-Datei (uploadForm.jsp) erstellt, wo ein Upload-Formular definiert wurde. Ich habe implementiert auch den Datei-Upload-Prozess das XMLHttpRequest-Objekt (Es ist Teil der Software-Spezifikationen ist. Ich habe keine andere Wahl)

<body> 
    <form id="file_form" action="upload" method="post" enctype="multipart/form-data"> 
     <input type="file" name="file_input[]" id="file_select" multiple webkitdirectory=""/> 
     <button type="submit" id="upload_button" >Upload</button> 
    </form> 
</body> 

<script type="text/javascript"> 

     // Get the form 
     var form = document.getElementById("file_form"); 

     // Get the file selecter 
     var fileSelect = document.getElementById("file_select"); 

     // Get the button which allows to upload the documents 
     var uploadButton = document.getElementById("upload_button"); 

     // Set up the request 
     var xhr = new XMLHttpRequest(); 

     // Create a new FormData object 
     var formData = new FormData(); 

     form.onsubmit = function(event){ 

      // Prevent the form to be submitted. We want to write our 
      // own submission protocol 
      event.preventDefault(); 

      // Update the button status during the uploading 
      uploadButton.innerHTML = 'Uploading...'; 

      // Get the selected files from the input 
      var files = fileSelect.files; 

      // Loop through each of the selected files 
      for(var i=0;i<files.length;i++){ 

       // The file contained in the file list 
       var file = files[i]; 

       // Add the file to the request 
       formData.append('file_input[]',file,file.name); 

       xhr.open('POST','upload',true); 

       // Send the data 
       xhr.send(formData);     
      } 
     }; 

     // Set up a handler for when the request finishes 
     xhr.onload = function(){ 

      if(xhr.status===200){ 

       // File uploaded 
       uploadButton.innerHTML = 'Uploaded'; 
      }else{ 
       alert('An error occurred.File was not uploaded'); 
      } 
     }; 

    </script> 

Wenn der Upload abgeschlossen ist. Der Benutzer wird automatisch auf eine andere Webseite umgeleitet namens "Upload" (upload.jsp) und verwiesen von einem Servlet (UploadServlet.java):

upload.jsp:

<html> 
    <head> 
     <title>TODO supply a title</title> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    </head> 
    <body> 
     Everything ok 
    </body> 
</html> 

UploadServlet.java:

@WebServlet(urlPatterns = {"/upload"}) 
public class UploadServlet extends HttpServlet { 

/** 
* Handles the HTTP <code>POST</code> method. 
* 
* @param request servlet request 
* @param response servlet response 
* @throws ServletException if a servlet-specific error occurs 
* @throws IOException if an I/O error occurs 
*/ 
@Override 
protected void doPost(HttpServletRequest request, HttpServletResponse response) 
     throws ServletException, IOException { 

    System.out.println("I am in the servlet"); 

    RequestDispatcher dispatcher=getServletContext().getRequestDispatcher("/WEB-INF/upload.jsp"); 
    dispatcher.forward(request,response); 
} 

Die ausgewählten Dateien korrekt hochgeladen werden zum Server. Wenn das Hochladen jedoch beendet ist, wird der Benutzer tatsächlich nicht zur Webseite "Upload" weitergeleitet. Er bleibt auf der "uploadForm" -Webseite und das ist nicht das, was ich erwartet habe.

Könnten Sie mir bitte helfen? Vielen Dank für Ihre Antworten

Antwort

2

Ajax Anrufe werden keine Umleitung (direkt) verursachen. Wenn Sie Ihre 200 bereit Statusänderung zurück haben, haben Sie das Javascript die Umleitung tun. Anstatt eine Weiterleitung in Ihrem Servlet zu haben, können Sie überlegen, ob Sie Informationen darüber erhalten, dass die Datei korrekt hochgeladen wurde, und überprüfen Sie diese zur Bestätigung ...

+0

Ok, vielen Dank, Rob! –

Verwandte Themen