Comentário: Mesmo que a imagem em linha seja codificada no Base64, a vantagem é que ela pode reduzir as solicitações HTTP, mas a desvantagem é que ela não pode ser armazenada em cache entre os domínios. Use a função ReadaSDataurl na API do arquivo html5. Este é um código que converte o arquivo em base64.
Acabei de entrar em contato com o conceito de imagens inlinadas. Mesmo que as imagens inlinadas sejam codificadas no Base64, olhando para o código a seguir, é um problema em linha.Pode reduzir as solicitações HTTP, mas a desvantagem é que ele não pode ser armazenado em cache nos domínios!
<img src = "Data: image/jpeg; base64,/9j/4qqsrx ...">
Em seguida, como converter fotos em base64 online
Se você confia apenas em javascript simples, você tem problemas de permissão e não permite que arquivos ou pastas de arquivos locais operem para problemas de segurança
Agora que o HTML5 está chegando ao Baidu, há muitas informações sobre chinês e muitos outros documentos para W3C
Agora, usamos a função readaDataurl na API do arquivo html5, que é um arquivo de conversão na codificação BASE64.
<! Doctype html public "-// w3c // dtd xhtml 1.0 transitional // pt" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-bransitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> Teste de arquivo simples html5 para pic2base64 </ititle>
<estilo>
</style>
<Cript>
window.onload = function () {
var input = document.getElementById ("Demo_input");
var resultado = document.getElementById ("resultado");
var iMg_area = document.getElementById ("img_area");
if (typeof (fileReader) === 'indefinido') {
Result.innerhtml = "Desculpe, seu navegador não suporta o FileReader, use um navegador moderno para operar!";
input.SetAttribute ('desativado', 'desativado');
} outro {
input.addeventListener ('alteração', readFile, false);}
}
function readfile () {
var arquivo = this.files [0];
// Aqui julgamos o tipo se não for uma imagem, retorne -o e remova -o e envie qualquer arquivo
if (!/imagem /// w+/. test (file.type)) {
alerta ("Verifique se o arquivo é o tipo de imagem");
retornar falso;
}
var leitor = new fileReader ();
leitor.readasDataurl (arquivo);
leitor.onload = function (e) {
resultado.innerhtml = '<img src = "'+this.result+'" />';
img_area.innerhtml = '<div> Imagem IMG Tag Display: </div> <img src = "'+this.result+'" />';
}
}
</script>
</head>
<Body>
<input type = "file" value = "sdgsdg" />
<textarea linhas = 30 cols = 300> </sexttarea>
<p> </p>
</body>
</html>