1. API de arquivo
O HTML5 fornece dois métodos: arquivo e filereader, que podem ler informações de arquivo e ler arquivos.
2. Exemplo
<html> <body> <div id = "test-image-view" style = "borda: 1px RGB sólido (204, 204, 204); largura: 100%; altura: 200Px; Background-Size: contém <bring-repeat: No-repeat; Posição do centro de fundo: Center;"> </div> <br/> type = "arquivo" id = "test-imagem-arquivo"> <script type = "text/javascript"> var fileInput = document.getElementById ('test-image-file'), info = document.getElementById ('test-file-info'), visualizar = document.GerementById ('test-image-preview'; function () {// Clear Background Image: Visuew.style.backgroundImage = ''; 'Tamanho:' File.size + '<br>' + 'modificado:' + file.lastmodifieddate; Filereader (); reader.readasDataurl (file);}); </script> </body> </html>O arquivo lido na forma de dataurl é uma string, semelhante a dados: imagem/jpeg; base64,/9j/4aaqsk ... (codificação base64) ...
Comumente usado para configurar imagens. Se o processamento do lado do servidor for necessário, envie a string base64 e os seguintes caracteres para o servidor e decodifique-o com base64 para obter o conteúdo binário do arquivo original.
3. Explicação
O código acima também demonstra um recurso importante do JavaScript, que é o modo de execução de fibra única. No JavaScript, o mecanismo de execução JavaScript do navegador sempre é executado no modo de thread único ao executar o código JavaScript, o que significa que, a qualquer momento, é impossível para o código JavaScript ter mais de um thread sendo executado ao mesmo tempo.
Você pode perguntar, como lidar com a multitarefa no modo de thread único?
No JavaScript, a multitarefa é realmente chamada de forma assíncrona, como o código acima:
leitor.readasDataurl (arquivo);
Uma operação assíncrona será iniciada para ler o conteúdo do arquivo. Por ser uma operação assíncrona, não sabemos quando a operação termina no código JavaScript, por isso precisamos definir uma função de retorno de chamada primeiro:
leitor.onload = function (e) {// Quando o arquivo é lido, essa função é chamada automaticamente:};Quando a leitura do arquivo for concluída, o mecanismo JavaScript chama automaticamente a função de retorno de chamada que definimos. Quando a função de retorno de chamada é executada, o arquivo foi lido, para que possamos obter com segurança o conteúdo do arquivo dentro da função de retorno de chamada.
O exemplo simples acima de visualização do arquivo de upload JS é todo o conteúdo que eu compartilho com você. Espero que você possa lhe dar uma referência e espero que você possa apoiar mais o wulin.com.