jsp
<%@ page language="java" contentType="text/html; charset=cp1251"
pageEncoding="cp1251"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=cp1251">
<title>Загрузка файлов</title>
<link rel=stylesheet type="text/css" href="/styles/style.css">
<style>
.td {
valign: top
}
</style>
<script type="text/javascript">
function upload(){
var x = document.getElementById("plan_upload");
for (var i = 0; i < x.files.length; i++) {
var file = x.files[i];
var plan_type='${param.par_type}'
var formdata = new FormData();
formdata.append("plan_upload", file);
var ajax = new XMLHttpRequest();
ajax.cur_number=(i+1);
ajax.total_number=x.files.length;
ajax.addEventListener("error", errorHandlerPlanUpload, false);
ajax.addEventListener("abort", abortHandlerPlanUpload, false);
ajax.onreadystatechange = function (){
if (ajax.readyState==4 && ajax.status==200){
var total_number = ajax.total_number;
var cur_number= ajax.cur_number;
if(cur_number==total_number){
alert('Загрузка файлов успешно завершена!');// upload successfull
window.opener.location.reload()
window.close();
}
}
}
ajax.open("POST", "MultipleFileUpload?par_type="+plan_type);
ajax.send(formdata);
}
}
function updateList (){
var input = document.getElementById('plan_upload');
var output = document.getElementById('fileList');
output.innerHTML = '<ul>';
for (var i = 0; i < input.files.length; ++i) {
output.innerHTML += '<li>' + input.files.item(i).name + '</li>';
}
output.innerHTML += '</ul>';
}
function errorHandlerPlanUpload(event){
alert("Ошибка при загрузке файлов!"); //cancel
window.opener.location.reload();
window.close()
}
function abortHandlerPlanUpload(event){
alert("Загрузка файлов была отменена!");//abort
window.opener.location.reload();
window.close();
}
</script>
</head>
<body style="background-color: white;">
<form name="multiple_upload_form" enctype="multipart/form-data" autocomplete="off" onsubmit="return false;" >
<input onchange="updateList()" accept=".xml,.osf,.zsf,.plax" id="plan_upload" name="plan_upload" multiple type="file" required />
<br/>Выбранные файлы:
<div id="fileList"></div>
<button id="testt" onclick="upload()" type="submit">Загрузить файлы</button>
</form>
</body>
</html>
package com.ieml.servlets.plan;
import java.io.*;
import java.sql.*;
import java.util.*;
import javax.servlet.*;
import javax.servlet.http.*;
import org.apache.commons.fileupload.*;
import org.apache.commons.fileupload.disk.*;
import org.apache.commons.fileupload.servlet.*;
import com.ieml.Global;
import com.ieml.util.*;
public class MultipleFileUploadServlet extends javax.servlet.http.HttpServlet {
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doPost(request, response);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
{
//PrintWriter out = response.getWriter();
String path = com.ieml.Global.getUploadDirectory();
Integer type= ServletUtilities.getIntParameter(request, "par_type");
if(path == null)
{
ServletUtilities.forwardErrorPage(request, response, "Не указано место хранения файлов");
return;
}
if(type==null)
{
ServletUtilities.forwardErrorPage(request, response, "Не указан тип плана");
return;
}
else
{
switch(type)
{
case 1:path+="/plans/incoming/"; break;
case 2:path+="/plansMag/incoming/";break;
case 3:path+="/plansSPO/incoming/";break;
default:break;
}
}
boolean isMultipart = ServletFileUpload.isMultipartContent(new ServletRequestContext(request));
if (isMultipart)
{
try
{
FileItemFactory factory = new DiskFileItemFactory();
ServletFileUpload upload = new ServletFileUpload(factory);
upload.setHeaderEncoding("UTF-8");
List<?> items = upload.parseRequest(request);
Iterator<?> iter = items.iterator();
while(iter.hasNext())
{
FileItem item = (FileItem)iter.next();
if (!item.isFormField())
{
String fileName = item.getName();
if(!fileName.endsWith(".xml") &&!fileName.endsWith(".XML") &&
!fileName.endsWith(".osf") && !fileName.endsWith(".OSF") &&
!fileName.endsWith(".zsf") && !fileName.endsWith(".ZSF")&&
!fileName.endsWith(".plax") && !fileName.endsWith(".PLAX")
)
{
ServletUtilities.forwardErrorPage(request, response, "Поддерживаемые форматы файлов: .xml, .osf, .zsf, .plax");
return;
}
try (Connection conn = Global.getConnection()){
File f = new File(path, fileName);
if(f.exists())
{
boolean success=f.delete();
if(!success)
{
try {
System.err.println("Не могу удалить файл "+f.getCanonicalPath());
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
}
File uploadedFile = new File(path, fileName);
try
{
item.write(uploadedFile);
}
catch(Exception e)
{
e.printStackTrace();
log(e.getMessage());
ServletUtilities.forwardErrorPage(request, response, "Не могу записать файл.");
}
}
break;
}
}
}
catch(SQLException e){
e.printStackTrace();
}
catch(FileUploadException fue){
fue.printStackTrace();
log(fue.getMessage());
ServletUtilities.forwardErrorPage(request, response, "Не могу принять файл.");
}
}
}
}
由于我必须使用旧的apache commons文件上载,我决定进行几个ajax调用(每个文件一个),但只在最后一个文件完成上载后显示“上载成功”消息。
由于某些原因,浏览器有时会显示多个成功的
上传警报,而不仅仅是一个
如果我选择了许多(15-20)文件进行上传,这种情况似乎会发生得更多。服务器端上载目录当前为本地文件夹。有什么建议可以解决我的onreadystatechange函数的问题吗?
我在windows xp上使用chrome 49.0.2623.112 m和firefox 52.1.1
UPD
function upload(){
var x = document.getElementById("plan_upload");
var noOfFiles = x.files.length;
var i=0;
for (i = 0; i < noOfFiles; i++)
{
var file = x.files[i];
var plan_type='${param.par_type}'
var formdata = new FormData();
formdata.append("plan_upload", file);
var ajax = new XMLHttpRequest();
ajax.cur_number=(i+1);
ajax.total_number=x.files.length;
ajax.addEventListener("error", errorHandlerPlanUpload, false);
ajax.addEventListener("abort", abortHandlerPlanUpload, false);
ajax.onreadystatechange = function ()
{
if (ajax.readyState==4 && ajax.status==200)
{
var total_number = ajax.total_number;
var cur_number= ajax.cur_number;
alert('i= '+i+' total files '+noOfFiles ) // i always equals noOfFiles
if(i == noOfFiles-1){ //Check if last file
alert('Загрузка файлов успешно завершена!');// upload successfull
window.opener.location.reload()
window.close();
}
}
}
ajax.open("POST", "MultipleFileUpload?par_type="+plan_type);
ajax.send(formdata);
}
}