Como evitar que o CSS do teu site fique armazenado em cache

Publicado por Fábio Berbert de Paula em 10/10/2014

[ Hits: 8.189 ]

Blog: https://fabio.city

 


Como evitar que o CSS do teu site fique armazenado em cache



Supondo que você está em fase de mudanças de layout e gostaria de evitar que teu arquivo CSS fique armazenado em cache no browser de seus visitantes. Como fazer?

Uma declaração tradicional de uma folha de estilo é assim:

<link rel="stylesheet" href="/css/estilo.css" type="text/css">

O truque pra evitar que o arquivo fique armazenado em cache é adicionar uma variável GET aleatória à URL. Exemplo:

<link rel="stylesheet" href="/css/estilo.css?id=12345" type="text/css">

O "como" criar tal variável de modo aleatório fica por sua conta. Se você usa PHP por exemplo, ficaria assim:

<link rel="stylesheet" href="/css/estilo.css?id=<?php echo time(); ?>" type="text/css">

Ou então mude o conteúdo de "?id=xxxx" toda vez que atualizar teu arquivo CSS.

O mesmo conceito vale para qualquer arquivo estático de seu website. Basta fazer com que o link que leva até ele tenha uma variável GET aleatória. Essa variável obviamente será descartada pelo arquivo, mas isso não importa.

Outras dicas deste autor

Ferramentas CASE para Linux

Cliente Google Authenticator para Linux (extensão Chrome)

O que diabos é um sistema de arquivos

Configurando e sincronizando com um servidor de data/hora

Capturando os últimos artigos do VivaoLinux

Leitura recomendada

Javascript - Criando galeria de imagens com "LIGTHBOX"

Assinatura personalizada com imagens no Gmail

Página inicial personalizada

CSS: Colocar imagem personalizada como botão submit

Acessibilidade e os padrões Web

  

Comentários
[1] Comentário enviado por Thihup em 11/10/2014 - 23:39h

Fabio , eu costumo importar o CSS assim :

[code]
<style type="text/css">
@import url('style.css');
</style>
[/code]

Como posso realizar esse processo ?

[]'s

T+

[2] Comentário enviado por fabio em 12/10/2014 - 01:24h


[1] Comentário enviado por Thihup em 11/10/2014 - 23:39h:

Fabio , eu costumo importar o CSS assim :

...

Como posso realizar esse processo ?

[]'s

T+


<style type="text/css">
@import url('style.css?id=001');
</style>

Espero que ajude!

[3] Comentário enviado por Thihup em 12/10/2014 - 11:34h


[2] Comentário enviado por fabio em 12/10/2014 - 01:24h:

&lt;style type="text/css"&gt;
@import url('style.css?id=001');
&lt;/style&gt;

Espero que ajude!


Cara , funcionou bem , nao sabia que era possivel misturar o PHP dentro de uma importação , mas tudo bem.

Muito obrigado

[]'s

T+


[4] Comentário enviado por fabio em 12/10/2014 - 23:09h


[3] Comentário enviado por Thihup em 12/10/2014 - 11:34h:

Cara , funcionou bem , nao sabia que era possivel misturar o PHP dentro de uma importação , mas tudo bem.



Na verdade não usei PHP, isso é sintaxe do HTML mesmo. Você pode adicionar argumentos a qualquer URL. Quem vai processar as variáveis GET enviadas via URL é que pode ser o PHP, Java, ASP.net, Python, Perl e por aí vai. Neste caso, como não vamos processar nada, o destino foi o arquivo CSS.



Contribuir com comentário




Patrocínio

Site hospedado pelo provedor RedeHost.
Linux banner
Linux banner
Linux banner

Destaques

Artigos

Dicas

Tópicos

Top 10 do mês

Scripts