redecomep:backbone:start
Differences
This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision | |||
|
redecomep:backbone:start [2025/10/07 13:50] admin |
redecomep:backbone:start [2026/02/13 15:38] (current) admin |
||
|---|---|---|---|
| Line 10: | Line 10: | ||
| </div> | </div> | ||
| - | <script> | + | <script> |
| // ======================================================================= | // ======================================================================= | ||
| // COLE O ENDEREÇO DA SUA IMAGEM (DO PASSO 1) NA LINHA ABAIXO: | // COLE O ENDEREÇO DA SUA IMAGEM (DO PASSO 1) NA LINHA ABAIXO: | ||
| Line 20: | Line 20: | ||
| const spanTimestamp = document.getElementById('timestamp-backbone'); | const spanTimestamp = document.getElementById('timestamp-backbone'); | ||
| - | // Define a imagem na página | + | // 1. CRIAÇÃO DO "CACHE BUSTER" |
| - | imgElement.src = imageUrl; | + | // Adiciona um timestamp único ao final da URL para obrigar o navegador a baixar a nova imagem |
| + | // Verificamos se a URL já tem "?" para saber se usamos "&" ou "?" | ||
| + | const separador = imageUrl.includes('?') ? '&' : '?'; | ||
| + | const urlComCacheBuster = imageUrl + separador + 't=' + new Date().getTime(); | ||
| - | // Busca a data de modificação do arquivo no servidor | + | // 2. PRÉ-CARREGAMENTO (Evita piscar ou mostrar metade enquanto carrega) |
| + | const downloadingImage = new Image(); | ||
| + | downloadingImage.onload = function(){ | ||
| + | // Só troca a imagem na tela quando a nova estiver 100% baixada | ||
| + | imgElement.src = this.src; | ||
| + | }; | ||
| + | // Inicia o download da nova imagem | ||
| + | downloadingImage.src = urlComCacheBuster; | ||
| + | |||
| + | // 3. ATUALIZAÇÃO DA DATA (Mantemos a URL original para checar o Header) | ||
| fetch(imageUrl, { method: 'HEAD', cache: 'no-cache' }) | fetch(imageUrl, { method: 'HEAD', cache: 'no-cache' }) | ||
| .then(response => { | .then(response => { | ||
| Line 35: | Line 47: | ||
| }); | }); | ||
| } else { | } else { | ||
| - | spanTimestamp.innerHTML = "Não foi possível obter a data do servidor."; | + | spanTimestamp.innerHTML = "Data indisponível."; |
| } | } | ||
| } | } | ||
| }) | }) | ||
| .catch(error => { | .catch(error => { | ||
| - | console.error('Erro ao verificar a data da imagem:', error); | + | console.error('Erro ao verificar a data:', error); |
| - | spanTimestamp.innerHTML = "Falha ao verificar a data."; | + | |
| }); | }); | ||
| } | } | ||
| Line 48: | Line 59: | ||
| verificarAtualizacaoImagem(); | verificarAtualizacaoImagem(); | ||
| | | ||
| - | // Opcional: Para fazer a página verificar por uma nova imagem e atualizar a data a cada 60 segundos, | + | // Atualiza a cada 60 segundos |
| - | // remova os "//" da linha abaixo. | + | setInterval(verificarAtualizacaoImagem, 60000); |
| - | setInterval(verificarAtualizacaoImagem, 60000); | + | |
| </script> | </script> | ||
| </html> | </html> | ||
redecomep/backbone/start.txt · Last modified: 2026/02/13 15:38 by admin
Page Tools
