現在、Google Chrome(4以上)用に最適化されたJava Webアプリケーションを開発しようとしています。ファイルアップロード後にAJAXがWebページにリダイレクトされない - POSTメソッド
複数のファイルを選択して(アップロードフォームと呼ばれるウェブページに表示されたフォームを使用して)サーバーにアップロードし、アップロードが完了したら自動的に別のWebページにリダイレクトされるようにします)。
アップロードフォームが定義されているJSPファイル(uploadForm.jsp)を作成しました。私はまた、アップロードが完了したXMLHttpRequestオブジェクトを(これは、ソフトウェア仕様の一部です。私は他に選択肢がない)
<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>
使用して、ファイルアップロードの処理を実装しています。
に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)で "アップロード"(にUpload.jsp )と呼ばれる別のWebページにリダイレクトされ、参照されています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);
}
選択したファイルが正しくアップロードされていますサーバーに送信します。ただし、アップロードが完了すると、ユーザーは実際には「アップロード」ウェブページにリダイレクトされません。彼は "uploadForm"ウェブページに残っていて、これは私が期待したものではありません。
お願いします。 あなたのお返事ありがとうございます
ありがとう、ロブありがとう! –