云存儲文件上傳功能

文件上傳功能目錄21.技術(shù)原理2.效果圖預(yù)覽3.實現(xiàn)步驟4.功能驗證測試技術(shù)原理3（1）視圖層：彈出文件上傳的操作界面（2）控制層：接收視圖層的消息，向服務(wù)層發(fā)送文件上傳參數(shù)，并將服務(wù)層返回的結(jié)果發(fā)送到視圖層（3）服務(wù)層：調(diào)用swift提供的接口實現(xiàn)文件上傳，并將上傳結(jié)果返回給控制層功能描述4實現(xiàn)步驟5在cn/edu/sict/cloud/storage/service/SwiftStorageService.java添加如下代碼public

booleancreateFile(Stringusername,Stringpath,Stringname,Stringfilepath){SwiftDFSswiftdfs=newSwiftDFS();swiftdfs.createFile(username,path,name,filepath);return

true;}實現(xiàn)步驟6在cn/edu/sict/cloud/storage/sh/SwiftDFS.java添加如下代碼public

booleancreateFile(Stringrootpath,Stringpath,Stringname,Stringfilepath){if(path.equals("")){path=null;}else{path=path.substring(0,path.length()-1);}os.objectStorage().objects().put(rootpath,name,Payloads.create(newFile(filepath)),ObjectPutOptions.create().path(path));return

true;}實現(xiàn)步驟7在cn/edu/sict/cloud/storage/Web/StorageController.java添加如下代碼@RequestMapping("/uploadfile")@ResponseBodypublicObjectuploadfile(HttpServletRequestrequest,HttpServletResponseresponse,@RequestParam(value="qqfile",required=true)MultipartFilefile){try{if(!file.isEmpty()){byte[]bytes=file.getBytes();Stringupath=request.getSession().getServletContext().getRealPath("/");Stringuuid=UUID.randomUUID().toString();Stringpath="upload/"+uuid+file.getOriginalFilename();FileOutputStreamfos=newFileOutputStream(upath+path);fos.write(bytes);實現(xiàn)步驟8在cn/edu/sict/cloud/storage/Web/StorageController.java添加如下代碼fos.close();return

newMessageBean(true,Constants.SUCCESS_4,path);}else{return

newMessageBean(false,Constants.ERROR_6);}}catch(Exceptione){return

newMessageBean(false,Constants.ERROR_6);}}實現(xiàn)步驟9在cn/edu/sict/cloud/storage/Web/StorageController.java添加如下代碼@RequestMapping("/createfile")@ResponseBodypublicObjectcreatefile(HttpServletRequestrequest,HttpServletResponseresponse,Stringpath,Stringname,Stringfilepath){Useruser=getSessionUser(request);Stringupath=request.getSession().getServletContext().getRealPath("/");boolean

flag=false;flag=storage.createFile(user.getUsername(),path,name,upath+filepath);return

newMessageBean(flag,flag?Constants.SUCCESS_4:Constants.ERROR_5);}實現(xiàn)步驟10采用“fineuploader”控件實現(xiàn)文件上傳，特點：（1）支持文件上傳顯示；（2）文件拖拽瀏覽器上傳方式；（3）Ajax頁面無刷新；（4）多文件上傳；（5）跨瀏覽器；（6）跨后臺服務(wù)端語言使用該控件需要引用js文件：<scriptsrc="assets/javascripts/fineuploader.js"></script>實現(xiàn)步驟11在main.jsp文件的js中添加如下代碼實現(xiàn)文件上傳functioncreateUploader(){varuploader=newqq.FineUploader({element:document.getElementById('result-uploader'),request:{endpoint:'uploadfile.action'},text:{uploadButton:'<iclass="glyphiconglyphicon-plus"></i>上傳文件'},實現(xiàn)步驟12在main.jsp文件的js中添加如下代碼實現(xiàn)文件上傳template:'<divclass="qq-uploader">'+'<preclass="qq-upload-drop-area"><span>{dragZoneText}</span></pre>'+'<divclass="qq-upload-buttonbtnbtn-defaultbtn-sm"style="background:#F6F6F6;border:1pxsolidrgb(206,206,206);display:inline;top:3px;padding:5px15px7px15px;width:100%;position:relative;overflow:hidden;border-radius:0;">{uploadButtonText}</div>'+'<spanclass="qq-drop-processing"style="display:none"><span>{dropProcessingText}</span>'+'<spanclass="qq-drop-processing-spinner"></span></span>'+'<ulclass="qq-upload-list"style="margin-top:10px;text-align:center;display:none"></ul>'+'</div>',實現(xiàn)步驟13在main.jsp文件的js中添加如下代碼實現(xiàn)文件上傳classes:{success:'alertalert-success',fail:'alertalert-error'},callbacks:{onComplete:function(id,fileName,responseJSON){if(responseJSON.success){varfielpath=responseJSON.other;createfile(fileName,fielpath);}}}});}實現(xiàn)步驟14在main.jsp文件的js中添加如下代碼實現(xiàn)文件上傳functioncreatefile(fileName,filepath){va