최근에 모바일 HTML5 응용 프로그램을 만들고 있습니다. 업로드 기능을 사용했습니다. 느린.
인터넷에서 오랫동안 LocalResizeimg 압축 프레임 워크를 발견했습니다.
1 단계 : LocalResizeimg을 다운로드하십시오LocalResizeimg은 GitHub에 배치되며 주소는 https://github.com/think2011/localresizeimg입니다.
2 단계 : 웹 엔지니어링에 LocalResizeimg 관련 JS를 소개합니다declaze localResizeIMG를 압축하여 디렉토리의 원위 폴더를 프로젝트에 복사 한 다음 JS 디렉토리에 넣습니다.
그런 다음 자체 JS에서 jQuery 및 localResizeImg JS를 가져옵니다. 좋다:
<span style = 화이트 포인트 : pre> </span> <script src = <c : url value =/js/jquery/jquery-1.10.0.min.js/>> </scan style = 흰색-스페이스 : pre> </span> <script type = text/javaScript src = <c : url value =/js/lrz/distal/lrz.bundle.js/>> </script>3 단계 : OnChange 이벤트를 자신의 업로드 입력의 파일 상자에 추가하십시오.
<입력 유형 = 파일 ID = PayFile Name = MyFile Style = Display : None;
FileChange 방법에서 코드의 압축과 배경으로 압축 된 후 생성 된 Base64의 비동기 전송을 구현하십시오.
filechange (var filepath = $); if (.jpg | .png | .bmp | .jpeg.touppercase (). indexof (ext.toupperCase ()) ==-1) {Alert (허용 JPG, PNG, BMP, JPEG 형식 사진); } // 사진 너비를 800으로 사용하여 lrz (that.files [0], {width : 800})를 압축합니다. thenction (function (rst) {// upload $ .ajax 비동기적 압축 후 $ .ajax ({url : <%= request.getContextPath ()%>/common/fileUploadPiction, 유형 : post, data : {imgdata : rst.base64 // compressed base value}, datatype : json, cache : fals e, async : false, success : function (data) {if (data.success) {alert (data.message); 메시지는 업로드 실패의 원인}}, error : function () {alert (alert (업로드 실패);});};};}입니다. 4 단계 : 스프링 MVC 컨트롤러 백그라운드에서 기본 값을 받고 파일을 구문 분석하고 저장합니다. Sun.Misc.Base64Decoder; // Intrastable Base64 Class/*** 파일 업로드*/ @reponsebody @requestmapping (common/fileUpPricture) 공개 객체 FileUploadPi CTURE (string imgdata, httpservletrequest 요청) {logger.info 파일 업로드 파일 : imgdata = +imgdata +]; 현재 엔지니어링 디렉토리 파일 ImageFile = 새 파일 (IMGPath); ) [1]); // (int i = 0; i <result.length; ++ i)에 대한 디코딩 ;}} outputStream.write (result);} catch (appexception e1) {logger.error (파일 업로드 (fileUpload) -astdfs] [error : + e1 +]; result (false, 파일 업로드 실패);} catch (예외 e) {logler.error ([fileUpload)] [error : + e +]); (); outputStrstros.Close ()}결과 클래스 :
java.io.serializable; .success = this.message = message;} public boolean issuccess () {return success;} public void setsuccess (boolean success) {thi s.success = success;} {반환 메시지;} public void setMessage (문자열 메시지) {this.message = message;} @override public String tostring () {return result [success = + success +, message = + message +];}}위의 모든 단계는 모든 단계입니다. 모두가 많은 의견을 제시하기를 바랍니다. 모든 사람이 VEVB Wulin.com을 지원하기를 바랍니다.