Récemment, je fais une application HTML5 mobile. lent.
J'ai trouvé le cadre de compression localResizeImg pendant longtemps sur Internet.
Étape 1: Télécharger localResizeImgLocalResizeImg est placé dans GitHub, l'adresse est: https://github.com/think2011/localresizeimg.
Étape 2: Introduire JS lié à LocalResizeImg en ingénierie WebDéclatez localResizeImg pour le comprimer, copiez le dossier distal dans le répertoire du projet, et je l'ai mis dans le répertoire JS.
Ensuite, importez JQuery et LocalResizeImg JS dans leur propre JS. comme:
<span style = blanc: pre> </ span> <script src = <c: url value = / js / jquery / jQuery-1.10.0.min.js / >> </ scan style = white -space: Pre> </ span> <script type = text / javascript src = <c: url value = / js / lrz / distal / lrz.bundle.js / >> </cript>Étape 3: Ajoutez l'événement Onchange à la zone de fichier de l'entrée de votre propre téléchargement.
<entrée type = id de file = PayFile Name = MyFile Style = Affichage: Aucun;
Implémentez la compression du code dans la méthode FileChange et la transmission asynchrone de la base64 générée après comprimé en arrière-plan
Fonction filechange (that) {var filepath = $ (that). if (.jpg | .png | .bmp | .jPeg.touppercase (). indexof (ext.toupperase ()) == - 1) {alert (a seulement permis jpg, png, bmp, jpeg format photo); } // Utilisez la largeur d'image pour être 800 pour compresser lrz (that.files [0], {width: 800}) .thenction (function (rst) {// upload $ .ajax asynchronous après compression $ .ajax ({url : <% = request.getContextPath ()%> / Common / FileUploadPiction, Type: Post, Data: {imgData: rst.base64 // Valeur de base compressée}, type de données: json, cache: fals e, async: false, succès: Fonction (data) {if (data.success) {alert (data.message); Le message est la cause de l'échec du téléchargement}}, erreur: function () {alert (téléchargement échoué);});});};} Étape 4: Contrôleur Spring MVC Recevoir des valeurs de base en arrière-plan et analyser et enregistrer des fichiers Import Sun.Misc.Base64Decoder; upload (File Téléchargez FileuploadPiction)] [Params: imgdata = + imgdata +]); Enregistrer le fichier root d'ingénierie actuel ImageFile = nouveau fichier (imgpath); ) [1]); ;}} outputStream.write (résultat); return neweult (true, imgpath);} catch (appexception e1) {logger.error ([file upload (fileupload) -fastdfs] [error: + e1 +]); Result (false, le téléchargement de fichiers a échoué);} catch (exception e) {logler.Error ([fileupload)] [Erreur: + e +]); ();Classe de résultats:
Importer Java.io.Serializable; Résultat public implémente Serializable {STATIC STATIQUE STATIQUE PRIVÉ .Success = Success; SetMessage (Message de chaîne) {this.message = message;} @Override public String toString () {return result [Success = + Success +, Message = + Message +];}}Ce qui précède est toutes les étapes.