Nous avons l'habitude toujours faire est de télécharger des fichiers, dossiers et fichiers de téléchargement télécharger similaires, mais il y a quelques différences, ce dossier a fait télécharger le dossier pour une utilisation future après l'autre.
Tout d'abord, nous devons comprendre trois éléments est téléchargé:
1. La soumission du formulaire: après (obtenir la soumission est limitée en taille, poste n °)
2. attribut formulaire enctype: doit être réglé sur multipart / form-data.
3. Le formulaire doit avoir l'article de téléchargement de fichier: le fichier, et la valeur de l'entrée nom de fichier donné besoin
Télécharger le dossier besoin d'ajouter un webkitdirectory de propriété, comme ceci:
<Input id = "fileFolder" name = "fileFolder" = "file" webkitdirectory>
Mais la propriété webkitdirectory il y a un problème, ne peut supporter une version supérieure de chrome, ne peut pas supporter la version inférieure de IE, comme IE6, IE7, IE8, ne correspondent pas à l'ensemble navigateur, l'environnement d'exploitation est relativement simple.
js peut déterminer le nombre de dossiers et de fichiers dans la taille du dossier répond aux exigences, ne répondent pas aux exigences ne peuvent pas être soumises à l'arrière-plan:
modèle HTML avant
this.GetHtmlFiles = function ()
{
var ACX = "";
ACX + = « <div class = id "fichier-item"= nom "TMPFILE"= "fileItem"> \
<Div class = "img-box"> <img name = "file" src = "js / file.png" /> </ div> \
<Div class = "zone-l"> \
<Div class = "file-tête"> \
<Div name = "fileName" class = "nom"> HttpUploader 程序 开发 .pdf </ div> \
<Div class name = "pour cent" = "pour cent"> (35%) </ div> \
<Div name = "fileSize" class = "taille" enfant = "1"> 1000.23MB </ div> \
</ Div> \
<Div class = "processus border"> <div class name = "process" = "processus"> </ div> </ div> \
<Div name = "msg" class = "msg top-space"> 15.3MB 20KB / S 10:02:00 </ div> \
</ Div> \
<Div class = "zone r"> \
<Span class = "BTN-case" name = "annuler" title = "取消"> <img name = "stop" src = "js / stop.png" /> <div> 取消 </ div> </ span> \
<Span class = "cacher BTN-box" name = title "post" = "继续"> <img name = "post" src = "js / post.png" /> <div> 继续 </ div> </ span > \
<Span class = "cacher BTN-box" name = title "stop" = "停止"> <img name = "stop" src = "js / stop.png" /> <div> 停止 </ div> </ span > \
<Span class = "cacher BTN-box" name = "del" title = "删除"> <img name = "del" src = "js / del.png" /> <div> 删除 </ div> </ span > \
</ Div> ';
ACX + = '</ div>';
// modèle de dossier
ACX + = « <div class = nom "fichier-item"= "folderItem"> \
<Div class = "img-box"> <img name = "dossier" src = "js / folder.png" /> </ div> \
<Div class = "zone-l"> \
<Div class = "file-tête"> \
<Div name = "fileName" class = "nom"> HttpUploader 程序 开发 .pdf </ div> \
<Div class name = "pour cent" = "pour cent"> (35%) </ div> \
<Div name = "fileSize" class = "taille" enfant = "1"> 1000.23MB </ div> \
</ Div> \
<Div class = "processus bordure supérieure de l'espace"> <div class name = "process" = "processus"> </ div> </ div> \
<Div name = "msg" class = "msg top-space"> 15.3MB 20KB / S 10:02:00 </ div> \
</ Div> \
<Div class = "zone r"> \
<Span class = "BTN-case" name = "annuler" title = "取消"> <img name = "stop" src = "js / stop.png" /> <div> 取消 </ div> </ span> \
<Span class = "cacher BTN-box" name = title "post" = "继续"> <img name = "post" src = "js / post.png" /> <div> 继续 </ div> </ span > \
<Span class = "cacher BTN-box" name = title "stop" = "停止"> <img name = "stop" src = "js / stop.png" /> <div> 停止 </ div> </ span > \
<Span class = "cacher BTN-box" name = "del" title = "删除"> <img name = "del" src = "js / del.png" /> <div> 删除 </ div> </ span > \
</ Div> ';
ACX + = '</ div>';
// liste de téléchargement
ACX + = « <div class = nom "fichiers panneau"= "post_panel"> \
<Div name = "post_head" class = "toolbar"> \
<Span class = "btn" name = "btnAddFiles"> sélectionner plusieurs fichiers </ span> \
<Span class = "btn" name = "btnAddFolder"> Sélectionner le dossier </ span> \
<Span class = "btn" name = "btnPasteFile"> coller des fichiers et des répertoires </ span> \
<Span class = "btn" name = "btnSetup"> 安装 控件 </ span> \
</ Div> \
<Div class = name "content" = "post_content"> \
<Div name = "post_body" class = "fichier post-view"> </ div> \
</ Div> \
<Div class = nom de "pied de page" = "post_footer"> \
<Span class = "BTN-pied de page" name = "btnClear"> fichier terminée Effacer </ span> \
</ Div> \
</ Div> ';
retourner ACX;
};
Sélectionnez le fichier, sélectionnez le dossier, et coller des fichiers et des dossiers logiques
this.open_files = function (json)
{
for (var i = 0, l = json.files.length; i <l; i ++)
{
this.addFileLoc (json.files [i]);
}
setTimeout (function () {_this.PostFirst ();}, 500);
};
this.open_folders = function (json)
{
for (var i = 0, l = json.folders.length; i <l; i ++) {
this.addFolderLoc (json.folders [i]);
}
setTimeout (function () {_this.PostFirst ();}, 500);
};
this.paste_files = function (json)
{
for (var i = 0, l = json.files.length; i <l; i ++)
{
this.addFileLoc (json.files [i]);
}
};
Après avoir reçu l'arrière-plan du dossier est différent dans le besoin MultipartHttpServletRequest
boolean isMultipart = ServletFileUpload.isMultipartContent (demande);
usine FileItemFactory = new DiskFileItemFactory ();
upload ServletFileUpload = new ServletFileUpload (usine);
Liste des fichiers = null;
essayer
{
fichiers = upload.parseRequest (demande);
}
catch (FileUploadException e)
{// analyser l'erreur de données de fichiers
out.println ( "Erreur de lecture de données de fichier:" + e.ToString ());
revenir;
}
FileItem rangeFile = null;
// obtenir tous les fichiers téléchargés
Itérateur fileItr = files.iterator ();
// boucle pour traiter tous les fichiers
tandis que (fileItr.hasNext ())
{
// obtenir le fichier en cours
rangeFile = (FileItem) fileItr.next ();
si (StringUtils.equals (rangeFile.getFieldName (), "pathSvr"))
{
pathSvr = rangeFile.getString ();
pathSvr = PathTool.url_decode (pathSvr);
}
}
packages et classes côté serveur
bloc de fichier de la page, des portions de code de vérification
booléen vérifier = false;
Chaîne msg = "";
Chaîne md5Svr = "";
longue blockSizeSvr = rangeFile.getSize ();
if (! StringUtils.isBlank (blockMd5))
{
md5Svr = Md5Tool.fileToMD5 (rangeFile.getInputStream ());
}
vérifier = Integer.parseInt (blockSize) == blockSizeSvr;
if (! vérifier)
{
msg = "taille de bloc erreur sizeSvr:" + blockSizeSvr + "sizeLoc:" + blockSize;
}
si (vérifier &&! StringUtils.isBlank (blockMd5))
{
vérifier = md5Svr.equals (blockMd5);
si (vérifier!) msg = "erreur md5 bloc";
}
si (vérifier)
{
// Enregistrer les données de bloc de fichier
FileBlockWriter res = new FileBlockWriter ();
// créer seul le premier
if (Integer.parseInt (blockIndex) == 1) res.CreateFile (pathSvr, Long.parseLong (lenLoc));
res.write (Long.parseLong (blockOffset), pathSvr, rangeFile);
up6_biz_event.file_post_block (id, Integer.parseInt (blockIndex));
JSONObject o = new JSONObject ();
o.put ( "ok" "msg",);
o.put ( "md5", md5Svr);
o.put ( "offset", blockOffset); // position décalée par rapport au bloc de fichiers
msg = o.toString ();
}
rangeFile.delete ();
out.write (msg);
Logic génère un nom de fichier
public String genFile (UID int, String md5, String nameLoc) throws IOException
{
SimpleDateFormat fmtDD = new SimpleDateFormat ( "dd");
SimpleDateFormat fmtMM = new SimpleDateFormat ( "MM");
SimpleDateFormat fmtYY = new SimpleDateFormat ( "yyyy");
Date date = new Date ();
Chaîne strDD = fmtDD.format (date);
Chaîne strMM = fmtMM.format (date);
Chaîne Stryy = fmtYY.format (date);
String path = this.getRoot () + "/";
path = path.concat (Stryy);
path = path.concat ( "/");
path = path.concat (strMM);
path = path.concat ( "/");
path = path.concat (strDD);
path = path.concat ( "/");
path = path.concat (md5);
path = path.concat ( "");
path = path.concat (PathTool.getExtention (nameLoc));
Fichier fl = new File (chemin);
retour fl.getCanonicalPath (); //
}
Ce qui suit est une couche de service de traitement à faire:
Module intégré divisé comme suit:
Dans lequel l'entité de traitement logique suivant classe de données
public class {FileInf
FileInf publique () {}
public String id = "";
public String pid = "";
public String pidRoot = "";
/ ** * Indique si l'entrée en cours est un élément de dossier. * /
public boolean fdTask = false;
// /// si le dossier fichier enfant /// </ summary>
public boolean fdChild = false;
/ ** * ID utilisateur. l'intégration du système avec l'utilisation de tiers. * /
public int uid = 0;
/ ** * fichier sur le nom de l'ordinateur local * /
public String nameLoc = "";
Nom / ** * les fichiers du serveur. * /
public String nameSvr = "";
Le chemin / ** * fichier complet sur l'ordinateur local. Exemple: D: \ soft \ QQ2012.exe * /
public String pathLoc = "";
Le chemin complet / ** * les fichiers du serveur. Exemple: F: \\ ftp \\ \\ uer md5.exe * /
public String pathSvr = "";
Chemin relatif / ** * fichier sur le serveur. Exemple: /www/web/upload/md5.exe * /
public String pathRel = "";
/ ** * MD5 du fichier * /
public String md5 = "";
/ * ** longueur du document numérisé. Octets, l'exemple: 120125 * /
à long lenLoc = 0 public;
/ ** * Taille du fichier Format. Exemple: 10.03MB * /
public String sizeLoc = "";
/ ** * emplacement du fichier CV. * /
publique à long décalage = 0;
/ ** * taille téléchargée. En octets * /
à long lenSvr = 0 public;
/ ** * pourcentage téléchargé. Exemple: 10% * /
public String = perSvr "0%";
Public = complet faux booléennes;
publique Date de PostedTime = new Date ();
public boolean supprimé = false;
/ ** * si l'analyse est terminée, pour fournir un grand dossier avec un grand début à analyser le dossier après le téléchargement. * /
public boolean scaned = false;
}
base de données back-end utilise essentiellement une classes d'entités logiques ci-dessus
classe table de données de fichier de fonctionnement est le suivant
Charger une liste de tous les fichiers incomplets
public String GetAllUnComplete (int f_uid)
{
StringBuilder sb = new StringBuilder ();
sb.append ( "select");
sb.append ( "F_ID");
sb.append ( "f_fdTask");
sb.append ( "f_nameLoc");
sb.append ( "f_pathLoc");
sb.append ( », f_md5" );
sb.append ( "f_lenLoc");
sb.append ( "f_sizeLoc");
sb.append ( ""); f_pos
sb.append ( "f_lenSvr");
sb.append ( "f_perSvr");
sb.append ( "f_complete");
sb.append ( "f_pathSvr"); // fix (16/03/2015): résoudre le problème ne peut pas déposer reprendre.
sb.append ( "de up6_files"); // changement (2015-03-18): les données du dossier d'enquête conjointe
sb.append ( "où f_uid = et f_deleted = 0 et f_fdChild = 0 et f_complete = 0 et f_scan = 0?"); // fix (18/03/2015): charger uniquement la liste inachevés
ArrayList <FileInf> fichiers = new ArrayList <FileInf> ();
DbHelper db = new DbHelper ();
PreparedStatement cmd = db.GetCommand (sb.ToString ());
try {
cmd.setInt (1, f_uid);
ResultSet r = db.ExecuteDataSet (cmd);
tandis que (r.next ())
{
FileInf f = new FileInf ();
f.uid = f_uid;
f.id = r.getString (1);
f.fdTask = r.getBoolean (2);
f.nameLoc = r.getString (3);
f.pathLoc = r.getString (4);
f.md5 = r.getString (5);
f.lenLoc = r.getLong (6);
f.sizeLoc = r.getString (7);
f.offset = r.getLong (8);
f.lenSvr = r.getLong (9);
f.perSvr = r.getString (10);
f.complete = r.getBoolean (11);
f.pathSvr = r.getString (12); // fix (19/03/2015): correction du problème ne peut pas reprendre le fichier.
files.add (f);
}
r.close ();
cmd.getConnection () close ().
cmd.close ();
} Catch (SQLException e) {
// TODO bloc catch généré automatiquement
e.printStackTrace ();
}
if (files.size () <1) return null;
Gson Gson g = new ();
retour g.toJson (fichiers); // bug: arrFiles est vide, cette ligne de code anormal
}
Pour obtenir l'effet global après
Téléchargez le dossier après effets
Enregistrez le serveur dossier de données, et la hiérarchie locale et le client est le même. Ce système d'OA ou d'un système de disque réseau est très utile lors de l'utilisation
La plupart de la logique de code back-end est le même, prend actuellement en charge MySQL, Oracle, SQL. Avant d' utiliser la nécessité de configurer la base de données, vous pouvez me référer à écrire cet article: http://blog.ncmem.com/wordpress/2019/08/12/java-http%E5%A4%A7%E6%96%87 % E4% BB% B6% E6 % 96% AD% E7% 82% B9% E7% BB% AD% E4% BC% A0% E4% B8% 8A% E4% BC% A0 /
Bienvenue sur le groupe de discussion « 374 992 201 » ensemble