Escrito antes:
Nos últimos dias, estudei o upload de arquivos WebUploader. O blog anterior registra exemplos de uso do WebUploader para simplesmente fazer upload de arquivos. Hoje, também registrarei os exemplos de fazer upload de fragmentos e pontos de interrupção. No parque do blog, também vi algumas informações. Basicamente, o processamento de back -end de dados é servlets ou springmvc. Como o projeto recente sempre foi o Struts2, usaremos a ação no STRUTS2 para processar os dados para alcançar o efeito de fazer upload de arquivos em peças.
1. O que é o upload do Shard?
Como o nome sugere, significa dividir o arquivo em pedaços, ou seja, deixar um arquivo ser dividido em vários arquivos pequenos e depois o carregando. A vantagem disso é que ele facilita o upload de arquivos grandes.
2. Idéias gerais para upload de fragmentação:
1. Na página da recepção, selecione o arquivo e clique no botão para fazer upload.
2. O WebUploader divide os arquivos enviados em números especificados e os envia para o back -end do servidor um por um.
3. O servidor recebe os arquivos pequenos divididos e os armazena em uma pasta temporária.
4. Depois que o servidor recebe o arquivo pequeno dividido, a página de primeiro plano executa a função de upload.
5. Na função de upload, envie uma solicitação ao servidor e solicite para mesclar os arquivos pequenos em um arquivo inteiro.
6. O segundo plano do servidor mescla os arquivos e exclui os arquivos temporários que armazenam arquivos pequenos após a conclusão da mesclagem.
Depois de entender o processo geral do upload do Shard, vá para a demonstração diretamente.
Página da recepção:
<%@ página contentType = "text/html; charset = utf-8" idioma = "java"%> <%string scheme = request.getScheme (); String servername = request.getServerName (); String contextpath = request.getContextPath (); int porta = request.getServerport (); // Acesso ao site e caminho String BaseUrl = Scheme + ": //" + serverName + ":" + porta + contextPath; request.setAttribute ("baseurl", baseurl);%> <html> <head> <titter> Exemplo simples de fazer upload de arquivos com </title> <%-Introdução de estilos CSS-%> <link href = "$ {Baseurl} /webuPloDer0.1.5/webuM Rel = "STILESHEET" TIPO = "TEXT/CSS"/> <SCRIPT SRC = "$ {BASEURL} /ligerui2/jquery/jquery-1.9.0.min.js" type = "text/javascript"> </script> <%-Introdução Atualização de upload plugin-%> <script) src="${baseURL}/webuploader0.1.5/webuploader.min.js"></script> <script type="text/javascript"> $(function(){ /* For the creation of uploader, it is best to wait until the dom element is created, that is, the following div is created, because the button to select the file is used, otherwise an error will be Criado. / Padrão: 'FILE'] Define o nome de upload de arquivo. Os arquivos carregados/* Esta é a chave. Padrão, para que a ordem de aceitação e os erros reorganize. comprimido, padrão se for JPEG, ele será compactado e carregando novamente antes de fazer o upload! "#FILELISTE"). HTML (""); $ (#FILELISTRO "). Appender ($ um); $ ("Estado"). Texto ("Upload ..."); $ .Post ("$ {BASEURL} /MergeFile", // System {GUID: Uploader.Options.FormData.Guid, Chunks: Math.ceil (file.size /(5 * 1024 * 1024), FILENAME: FILE.Name}, função (Data) (}); // Falha no upload. $ ("#btnClick"). Clique em (function () {uploader.upload ();}); id = "uploader-Demo"> <div id = "filelelist"> selecione Arquivo </div> <botão id = "btnClick"> Iniciar upload </button> <button id = "btncancel"> cancelar upload </butter> </div> </div> </body </html>Ação de back -end:
/** * Descrição: com.ims.action * Autor: Eleven * Data: 2017/12/26 10:50 */@Controller ("FileAction") Public class FileAction {/ * Parâmetros relacionados para cada pequeno arquivo usado para receber a solicitação de segmentação */// Lembre -se de fornecer o método de obtenção de arquivo // upload (o mesmo nome do nome do formulário do tipo de segmento * // Lembre -se de que o mesmo número de file (o mesmo número de segmentação * // // lembre // Nome do arquivo Private String UPLOPLONENEME; // Tipo de upload Private String uploadContentType; /** * As seguintes variáveis são públicas, existem muitos parâmetros, por isso não quero configurá -lo como privado e depois escrever o método Get and Set, * basta usar o público apenas por preguiçosos */// sharding número de string public string chunk; public String Guid; // Merge e Split são usados para receber e enviar solicitações de mesclagem public string filename; // Nome do arquivo public string chunks; // Número do segmento // Ao fazer o upload de arquivos em shards, esse método será chamado toda vez que um pequeno arquivo é carregado, o que não é diferente dos arquivos de salvamento ordinários public void uploadfile2 () lança exceção {string str = "d:/upload44/divide/"; // Caminho de economia de arquivo // salve o caminho de cada pequeno arquivo string realpath = str + guid + "/" + chunk; Arquivo tmp = novo arquivo (realpath); Fileutils.copyfile (upload, tmp); System.out.println ("FILHO DE TOLHADO"+UPLOPLFILENAME+", que bloco:"+chunk+", tamanho:"+(upload.length ()/1024/1024)+"m"); } // Arquivo Mesclar public void MergeFile () lança Exceção {String Path = "D:/Upload44/Merge/"; // Crie pasta de mesclagem novo arquivo (caminho) .mkdir (); // crie arquivo de arquivo mesclado newFile = novo arquivo (caminho + nome do arquivo); if (! newfile.exists ()) {newfile.createnewfile (); } FileOutputStream outputStream = new FileOutputStream (newFile, true); // Adicione o arquivo anexado ao byte [] byt = novo byte [10 * 1024 * 1024]; int len; FileInputStream temp = null; // arquivo shash para (int i = 0; i <intoger.parseInt (chunks); i ++) {// "d:/upload44/divide/" + guid + "/" + i para salvar o caminho do arquivo dividido pequeno/novo fileInputStream (novo ("D: D:/" D:/ULLOGEN4:/ULLOVER4 D:/URLIGAD4) while ((len = temp.read (byt))! = -1) {System.out.println (len); outputStream.Write (byt, 0, len); } temp.close (); } // Quando todas as gravações do Append são concluídas, o fluxo pode ser fechado outputStream.close (); // Excluir arquivo shard string path2 = "d:/upload44/divide/" + guid; Fileutils.deleteDirectory (novo arquivo (path2)); // excluir todos os conteúdos no diretório system.out.println ("success! Guid =" + guid + "; chunks =" + chunks + "; filename =" + nome do arquivo); } public file getUpload () {return upload; } public void setupLoad (upload de arquivo) {this.upload = upload; } public String getUploadFilEName () {return uPLOPLeFilename; } public void setupLoadFilename (String uPLOPLeName) {this.uploadfilename = uPLOPLFILENAME; } public string getUploadContentType () {return uPLOPLONTENTTYPE; } public void setupLoadContentType (String uPLOPLONTENTTYPE) {this.uploadContentType = uPLOPLONTENTTYPE; }}Struts.xml Configuração:
<ação name = "uploadfile2" method = "uploadfile2"> </action> <ação name = "mergefile" método = "mergefile"> </ction>
Ok, aqui, o upload de um ponto de interrupção de fragmentação de arquivo simples é concluído.
A propósito, o plano de fundo recebe apenas alguns parâmetros simples e, é claro, existem mais do que os parâmetros acima passados do WebUploader front-end. Portanto, você pode aprender a usar o modo de depuração F12 para visualizar as solicitações enviadas e os parâmetros de solicitação relacionados. Não vou falar sobre isso aqui.
Running Screenshot:
O exposto acima é todo o conteúdo deste artigo. Espero que seja útil para o aprendizado de todos e espero que todos apoiem mais o wulin.com.