前一段時間,接到一個需求。要求在客戶端選擇一文件夾,然後將整個文件夾一起上傳。在網上找了些資料也不盡詳細,就自己整理了一份。
頁面代碼如下:
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>UpLoad</title>
<script type="text/javascript" >
function fileupload(filepath){
if(filepath!=""){
sendFileToServer(filepath);
} else{
alert("請選擇要上傳的文件");
}
}
function callback() {
if (xmlhttp.readyState == 4) {
var responseText = xmlhttp.responseText;
}
}
function sendByteStreamToServer(stream,url){
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
if (xmlhttp.overrideMimeType) {
xmlhttp.overrideMimeType("text/xml")
}
} else if (window.ActiveXObject) {
var activexName = ["MSXML2.XMLHTTP","Microsoft.XMLHTTP"];
for (var i = 0; i < activexName.length; i++) {
try {
xmlhttp = new ActiveXObject(activexName[i]);
break;
} catch(e) {
e.print()
}
}
}
xmlhttp.onreadystatechange = callback;
xmlhttp.open("post", url, false);
boundary="abcd"
xmlhttp.setRequestHeader("Content-Type", "multipart/form-data, boundary="+boundary);
xmlhttp.setRequestHeader("Content-Length", stream.Size);
xmlhttp.send(stream);
}
function sendFileToServer(filePath){
var filepath=encodeURI(encodeURI(filePath));
var stream =new ActiveXObject("ADODB.Stream");
stream.Type=1;
stream.Open();
stream.Position = 0;//指定或返加對像內數據的當前指針。
stream.LoadFromFile(filePath) //將FileName指定的文件裝入對像中,參數FileName爲指定的用戶名
stream.Position = 0;
sendByteStreamToServer(stream,"<%=request.getContextPath() %>/upLoad.do?path="+filepath);//請求路徑
stream.Close();
}
var countfiles=0;
var countfolders=0;
//用於打開瀏覽對話框選擇路徑
function BrowseFolder(){
try{
var Message = "請選擇文件夾"; //選擇框提示信息
var Shell = new ActiveXObject( "Shell.Application" );
var Folder = Shell.BrowseForFolder(0,Message,0x0040,0x11);//起始目錄爲我的電腦
//var Folder = Shell.BrowseForFolder(0,Message,0); //起始目錄爲桌面
if(Folder != null){
Folder = Folder.items(); // 返回 FolderItems 對象
Folder = Folder.item(); // 返回 Folderitem 對象
Folder = Folder.Path; // 返回路徑
if(Folder.charAt(Folder.length-1) != "\\"){
Folder = Folder + "\\";
}
return Folder;
}else{
Folder="";
return Folder;
}
} catch(e){
alert(e.message+"11");
}
}
//用於遍歷
function traverse(localPath,textHtml){
var fso = new ActiveXObject("Scripting.FileSystemObject");
var currentFolder = fso.GetFolder(localPath);
var fileList = new Enumerator(currentFolder.files);
var subFolderList = "";
var fileHtml=textHtml;
var aFile;
for (; !fileList.atEnd(); fileList.moveNext()) {
countfiles++;
aFile=fileList.item();
fileHtml.push(aFile.Path);
}
subFolderList = new Enumerator(currentFolder.SubFolders);
for (; !subFolderList.atEnd(); subFolderList.moveNext()) {
countfolders++;
fileHtml=traverse(subFolderList.item().Path,fileHtml)//遞歸遍歷子文件夾
}
return(fileHtml);
}
function showDiv(){
document.getElementById('loadStyle').style.display='inline';
}
function browse(){
showDiv();
document.all.path.value=BrowseFolder();
if(viewfiles()){
document.getElementById('loadStyle').style.display='none';
alert("文件上傳成功");
}//上傳文件
}
function viewfiles(){
var ts = document.getElementById('loadStyle');
var flag = true;
var textHtml = new Array();
var textHtmls = new Array();
var folderpath=document.all.path.value;
if(folderpath == ''){
document.getElementById('loadStyle').style.display='none';
flag = false;
}else{
setTimeout("showDiv()",2000);
textHtmls=traverse(folderpath,textHtml);
for(var i=0;i<(textHtmls.length);i++){
fileupload(textHtmls[i]);
ts.innerHTML = textHtmls[i] + "<br/>";
}
flag = true;
}
return flag;
}
</script>
</head>
<body>
<input type="text" id="path" name="path">
<input type="button" value="選擇" οnclick="browse()">
<div style="display: none;" id="loadStyle">
文件上傳中
</div>
</body>
</html>
後臺java腳本如下:
public class Upload extends Action {
@Override
public ActionForward execute(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response)
throws Exception {
response.setContentType("text/plain");
PrintWriter outNet = response.getWriter();
int id = Integer.parseInt(request.getParameter("id"));
String filePath = java.net.URLDecoder.decode(request.getParameter("path"),"UTF-8");
String fileName = filePath.substring(filePath.lastIndexOf("\\") +1);
String loadPath = "E:\\demo\\test\\"; //將要上傳到的路徑。
InputStream in = request.getInputStream();
BufferedInputStream bis = new BufferedInputStream(in);
File file = new File(loadPath);
if(!file.exists()){
file.mkdir();
}
BufferedOutputStream bos = new BufferedOutputStream(new FileOutputStream(new File(loadPath + fileName)));
int b = 0;
while((b = bis.read()) != -1){
bos.write(b);
bos.flush();
}
bis.close();
bos.close();
in.close();
System.out.println("文件上傳成功");
return null;
}
PS:
web配置沒有附上,大神們自己寫就行了!這個不難!
由於對於安全考慮,瀏覽器默認會關閉ActiveX,需要將你的站點設置爲可信再點方可使用該功能,否則會報錯說沒有權限。
所以,各位依需要選擇。