Introdução ao PLUPLOAD
O PLUPLOAD é desenvolvido pelos desenvolvedores da TINYMCE, fornecendo um plug-in de upload altamente disponível para o seu sistema de gerenciamento de conteúdo ou programas de upload semelhantes. Atualmente, o PLUPLOAD está dividido em uma API do núcleo e um componente de fila de upload jQuery, que permite usá -lo diretamente ou personalizá -lo.
1. Exibição de efeito
Incluindo o painel de upload de arquivos e a lista de upload de arquivos
2. Introdução
Para ser curto, o Spring Springmvc Mybatis Maven MySQL é usado para realizar a função de upload de vários arquivos, e o download usa a forma de fluxos.
Vou abrir outro blog para apresentar as páginas envolvidas.
3. Prepare os materiais
PLUPLOAD
Artdialog
Há também um arquivo JS que inicializa o plugin
Estes podem ser baixados diretamente da minha conexão de compartilhamento
Link: http://pan.baidu.com/s/1c27ctak Senha: BTQJ
Há também download de jQuery
4. Código da recepção
Apresente estilos e arquivos JS
<link rel="stylesheet" href="resources/css/plupload.css" type="text/css"><script src="resources/js/jquery.min.js"></script><script src="resources/upload/plupload.full.min.js"></script><script src = "Resources/ArtDialog4.1.7/Artdialog.source.js? Skin = Blue"> </sCript> <script src = "Resources/js/upload.js"> </script>
Código JS
_PLUPLOAD (BIMIND UUID, caminho de upload de arquivos); ① Em relação a Uuid ligado, deixe -me dar um exemplo. O ID do usuário atual é UUID. Você pode associar o ID do usuário ao arquivo que você carrega. Se você consultar no futuro, poderá consultar todos os arquivos enviados pelo ID do usuário de acordo com o ID do usuário. ② Este método é encapsulado e pode ser visto no upload.js. Os comentários no meu artigo são muito claros e você também pode se referir ao documento oficial.
$ (function () {3 $ ('#UPLOPLBTN'). Click (function () {PopUpDialog ();}); _plupload ('teste', '$ {PageContext.Request.ContextPath}/UploadFile');});Código da página, um botão, uma caixa pop-up
<a id = "uploadbtn" href = "#"> upload de arquivo </a> <!-acionar a caixa pop-up-> <div id = "uploadContent" style = "display: nenhum; altura: 300px; overflow-x: hidden; suportes menos; href = "JavaScript: void (0);"> selecione Arquivo </a> </div> <div id = "uploadfilequeue" style = "borda: 1px Solid #A7C5E2; altura: 228px; largura: 350px;"> </div> </div> <pred = "Console"
5. Código de fundo
Não tenho um método para encapsulá -lo, para que eu possa encapsulá -lo para vê -lo claramente
/** * File upload request address* * @param request * @param response */ @RequestMapping("uploadfile") public void upload(HttpServletRequest request, HttpServletResponse response) { MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;// Binary upload CommonsMultipartFile file = (CommonsmultipartFile) multipartRequest.getfile ("file"); // obtenha o arquivo string unid = uuid.randomuuid (). Tostring (). Reply ("-", "");* arquivo primário*/ string filefilename = file.getorIginalFilEname (); String.valueof (file.getSize ());/* Tamanho do arquivo*/ string caminho = null;/* Caminho de armazenamento do arquivo*/ string punid = request.getParameter ("punid"); / * Punid de arquivo associado */// Salvar arquivo if (arquivo! = Null) {try {string basepath = request.getSession (). GetServletContext (). GetRealPath ("/uploadfile"); SimpledateFormat sdf = new SimpleDateFormat ("/yyyy/mm/dd/"); String subpath = sdf.format (new Date ()); PATH = BASEPATH + SUBPATH + UNID + FILE.separator + OriginalFilename; // Se a pasta não existir, crie um arquivo de pasta dir = novo arquivo (caminho); if (! Dir.Exists ()) {Dir.mkdir (); } file.transferto (dir); } catch (Exceção e) {e.printStackTrace (); }} // Conversão do tamanho do arquivo Kb longa = 1024; MB longo = Kb * 1024; GB longo = mb * 1024; tamanho longo = long.parselong (Fliesize); if (size> = gb) {fliesize = string.format ("%. 1f gb", (float) size / gb); } else if (size> = mb) {float f = (float) size / mb; fliesize = string.format (f> 100? "%.0f mb": "%.1f mb", f); } else if (size> = kb) {float f = (float) size / kb; fliesize = string.format (f> 100? "%.0f kb": "%.1f kb", f); } else {fliesize = string.format ("%d b", tamanho); } // armazenar informações do arquivo no banco de dados FileUpload fileUpload = new FileUpload (); fileUpload.setunid (unid); FileUpload.SetoriginalFilename (OriginalFileName); fileUpload.setFliesize (Fliesize); fileUpload.setPath (Path); FILEUPLOAD.SETPUNID (PUNID); SimpledateFormat df = new SimpleDateFormat ("AAAA-MM-DD HH: MM: SS"); fileUpload.setflietime (df.format (new Date ())); fileUploadService.insert (FileUpload); }Aqui vem um método de download, que deve usar fluxos de arquivo para baixar de acordo com o ID do arquivo
@RequestMapping ("DownloadFile") public void DownloadLoadFile (httpServletRequest Request, httpServletResponse resposta) {string unid = request.getParameter ("unid"); FileUpload fileUpload = fileUploadservice.SelectByPrimaryKey (UNID); if (fileUpload! = null) {try {string filename = new String (fileUpload.getoriginalfilename (). getBytes ("gbk"), "iso-8859-1"); String Path = FileUpload.getPath (); Response.Setcharacterencoding ("UTF-8"); Response.setContentType ("Application/Octet-Stream"); Response.setheader ("Content-Disposition", "Applement; FileName =" + FileName); Response.setheader ("Length-Length", FileUpload.getfliesize ()); InputStream inputStream = new FileInputStream (novo arquivo (caminho)); OutputStream OS = Response.getOutputStream (); byte [] b = novo byte [2048]; comprimento int; while ((length = inputStream.read (b))> 0) {os.Write (b, 0, comprimento); } os.close (); inputStream.close (); } catch (filenotfoundException e) {e.printStackTrace (); } catch (ioexception e) {e.printStackTrace (); }}}Há também uma maneira de excluí -lo
/ ** * exclusão de arquivo * * @param request * @param Resposta */ @ResponseBody @RequestMapping ("Delfile") Public Map <String, Object> Defile (httpServletRequest Request, httpServletResponse resposta) {string unid = request.GetParameter ("unid"); FileUpload fileUpload = fileUploadservice.SelectByPrimaryKey (UNID); // Excluir bandeira booleana local = false; Arquivo de arquivo = novo arquivo (fileUpload.getPath ()); if (file.exists ()) {// se o caminho for um arquivo e não estiver vazio, exclua flag = file.Delete (); } // exclua o banco de dados int resultado = fileUploadservice.DeleteByPrimaryKey (UNID); if (resultado> 0) {flag = true; } Mapa <string, object> map = new hashmap <string, object> (); map.put ("resultado", sinalizador); mapa de retorno; }O acima é o Artdialog+Plupload apresentado a você pelo editor. Espero que seja útil para você. Se você tiver alguma dúvida, deixe -me uma mensagem e o editor responderá a você a tempo. Muito obrigado pelo seu apoio ao site wulin.com!