* 1. Bootstrap-FileInput Plug-in Git Download Adresse
https://github.com/kartik-v/bootstrap-fileinput.git
2. Résoudre l'utilisation de bootstrap-fileinput pour obtenir la valeur de retour
Télécharger des photos
$ ("# file-0a"). fileInput ({uploadUrl: "/ upload_img", // a téléchargé le UrlAllowedFileExtensions pour télécharger l'image: ['jpg', 'png', 'gif'], la taille maximale du fichier du fichier maxfilesNiles: 1, // uplowé Nombre maximum de fichiers InitialCaption: "Veuillez télécharger le logo du commerçant", // la valeur de zone de texte initiale // ALLERDFILETYPES: ['Image', 'Video', 'Flash'], SlugCallback: fonction (nom de fichier) {return filen.Notez qu'après avoir téléchargé l'événement d'image, obtenez la méthode d'écriture de valeur de retour
$ ('# file-0a'). sur ('fileuploaded', fonction (événement, data, préviewid, index) {var form = data.form, files = data.files, extra = data.extra, réponse = data.Response, lecter = data.reader; console.log (réponse); // imprimez le chemin retourné;page jsp
<input id = "file-0a" type = "file" MultipledAta-Min-File-Count = "1" name = "upload_logo">
où data-min-file-Count = ”1” fait référence au nombre minimum de fichiers téléchargés
3. Code de serveur
Utilisez le propre plug-in de Spring pour télécharger, le framework est Springmvc
Haricot
Importer java.util.list; image de classe publique {Liste privée <string> paths; public list <string> getPaths () {return paths;} public void setPaths (list <string> paths) {this.paths = paths;}}Contrôleur
@ Réponsebody @ requestmapping (value = "upload_img", méthode = requestMethod.post) public image uploadImage (@RequestParam multipartFile [] upload_logo) lance ioException {log.info ("upload image"); image pic = new Picture (); list <string> cherse UploadUtil.getFolder (); pour (multipartFile myFile: upload_logo) {if (myFile.iSempty ()) {log.info ("fichier non téléchargé"); } else {log.info ("Longueur de fichier:" + myFile.getSize ()); log.info ("type de fichier:" + myFile.getContentType ()); log.info ("nom de fichier:" + myFile.getName ()); log.info ("nom de fichier:" + myFile.getoriginalFileName ()); log.info("========================================================================================= ========================================================================================================================. ========================================================================================================================. ========================================================================================================================. UploadUtil.writeFile (myFile.getoriginalFileName (), dir, myFile.getInputStream ()); log.info ("Path de fichier:" + path); paths.add (path);}} pic.setPaths (paths); return pic;}téléchargement
Logger final statique privé = loggerfactory.getLogger (uploadUtil.class); private uploadUtil () {} private static SimpledateFormat fullsdf = new SimpledateFormat ("yyyymmddhhmmsssss"); Private Static SimpledateFormat Folder = new SimpledateFormat ("Yyyy" + file.separator + "mm" + file.separator + "dd"); / *** return à yyyy file.separator mm file.separator dd format String * * @ return * / public static string getfolder () {return folder.format (new Date ();} @param srcname * Nom du fichier d'origine * @param dirname * Nom du répertoire * @param entrée * Stream d'entrée à enregistrer * @return renvoie le chemin à enregistrer dans la base de données * / public static string writefile (string srcname, string divername) entrée) lance ioException {Log.info (srcname); // Take Out Discaire Répertoire configuré dans Tomcat's Server.xml String uploadDir = contextUtil.getsysprop ("upload_dir"); // définir le chemin de téléchargement // Répondez le chemin d'accès de la chaîne de répertoire virtuel virtualdir = contextutil.getsysprop ("virtual_dir"); // définit l'accès à votre répertoire virtuel // Rename le fichier if (null! = Sr {srcname = srcname.substring (srcname.indexof ("."));} else {srcname = ".jpg";} string filename = ""; // obtenir le chemin de fichier pour télécharger filename = uploaddir + file.separator + dirname + file.separator + fullsdf.format (newa srcname; // Obtenez le chemin à enregistrer sur la chaîne de données SavePath = filename.replace (uploaddir, ""); sauvepath = virtualdir + sauvepath.replace ("//", "/"); file file = new File (filename); if (! file.getParentFile (). exists ())); gens comte);} fos.flush (); fos.close (); input.close (); return SavePath;}4. Résolvez quelques problèmes rencontrés lors du téléchargement
Si vous rencontrez un clic pour télécharger, la barre de progression est affichée à 100% et la page JSP affiche [Objet, OBEJCT], alors faites attention à l'objet de l'objet JSON retourné que vous êtes en arrière-plan.
Ce qui précède est la méthode du plug-in FileInput de Bootstrap pour implémenter plusieurs téléchargements de fichiers que l'éditeur vous a présentés. J'espère que cela vous sera utile. Si vous avez des questions, veuillez me laisser un message et l'éditeur vous répondra à temps. Merci beaucoup pour votre soutien au site Web Wulin.com!