JS retornando conteúdo de uma pag

Kanzen · Janeiro 9, 2011

Pessoal estou tentando desenvolver um pequeno gadget para o windows sidebar que será apenas uma janela para mostrar um conteúdo de uma pag da internet.

Ja consegui criar tudo mas estou com 2 problemas

1- é q eu preciso adicionar um código JS q faça a verificação se houve atualizações na página de X em X minutos

2 - é que mesmo eu fechando e abrindo de novo o aplicativo ele não atualiza a página. É como se ele usassem um cache.

(se eu troco a url de www.meusite.com para meusite.com ele pega o novo conteudo mas se eu volto para www.meusite.com ele volta para o conteúdo antigo, claramente usando um cache)

código JS utilizado:

<html>
		<head>
		    <title>News</title>
   <script type="text/javascript">
function ajax(url,destino) {
       req = null;
       if (window.XMLHttpRequest) { // Procura por um objeto nativo (Mozilla/Safari)
               req = new XMLHttpRequest();
               req.onreadystatechange = processReqChange;
               req.open("GET",url,true); //abre a requisição para o arquivo php que pesquisará o estado
               req.send(null);
       } else if (window.ActiveXObject) { // Procura por uma versão ActiveX (IE)
               req = new ActiveXObject("Microsoft.XMLHTTP");
               if (req) {
                       req.onreadystatechange = processReqChange;
                       req.open("GET",url,true); //abre a requisição para o arquivo php que pesquisará o estado
                       req.send();
               }
       }
       destino_retorno = destino;
}

function processReqChange() {
       if (req.readyState == 4) { // apenas quando o estado for "completado"
               if (req.status == 200) { // apenas se o servidor retornar "OK"
                       document.getElementById(destino_retorno).innerHTML = req.responseText;
               } else {
                       alert("Houve um problema ao obter os dados:n" + req.statusText);
               }
       } else if (req.readyState == 1) {
               document.getElementById(destino_retorno).innerHTML = '<span style="font-family:Arial;color:#666666;">Carregando</span>';        
       }
}

   function preenche() {
     var url = "http://www.meusite.com.br/lista.php"; //monta a url que será "processada" pelo ajax
     ajax(url,"meio"); //devolve a resposta no "campo" + id. Ou seja campo1, campo2, campo300
   }
</script>
               <style>
               body{
				background:url(fundo.png) repeat;
				color:#F60;
				font-family: helv, Verdana, Arial, sans-serif;
				font-weight:bold;
				font-size:14px;
				width:520px;
				height:600px;}
				#gadgetContent{ margin-left:0px;}
				#topo{ background:url(topo.png); height:28px; width:500px;}
				#meio-1,#meio{ background:url(meio.png) repeat; padding-left:15px; width:500px;}
				#meio-1{ padding-left:100px;}
				#texto{ width:300px; text-align:center;}
				#meio{ height:300px; padding-top:50px;}
				#baixo{ background:url(baixo.png); height:28px; width:500px;}
				.texto_link a { text-decoration:none; color:#F60; font-size:16px; height:35px;}
               </style>
		</head>
		<body onLoad="preenche()">
		    <div id="gadgetContent">
               <div id="meio-1"><img src="logo.png" width="300px" height="150px;" /></div>
               <div id="meio"></div>
               <div id="baixo"></div>
		    </div>
		</body>

		</html>

Eliseu M. · Janeiro 9, 2011

Para desabilitar o cache, você pode criar o arquivo .htaccess na pasta do seu site (no servidor Apache) e inserir o seguinte conteúdo:

Header set Expires "Thu, 19 Nov 1981 08:52:00 GM"
Header set Cache-Control "no-store, no-cache, must-revalidate, post-check=0, pre-check=0"
Header set Pragma "no-cache"

Kanzen · Janeiro 9, 2011

testei aqui e não adiantou =/

o gadget continua a usar o conteúdo salvo. Acredito ser algum configuração própria no gadget e não no servidor.

Patrique · Janeiro 10, 2011

Crie um numero random pelo javascript e coloque esse numero como variavel na url a ser carregada, vai ficar assim...

<html>
                       <head>
                           <title>News</title>
   <script type="text/javascript">
       function ajax(url,destino) {
       req = null;
       if (window.XMLHttpRequest) { // Procura por um objeto nativo (Mozilla/Safari)
               req = new XMLHttpRequest();
               req.onreadystatechange = processReqChange;
               req.open("GET",url,true); //abre a requisição para o arquivo php que pesquisará o estado
               req.send(null);
       } else if (window.ActiveXObject) { // Procura por uma versão ActiveX (IE)
               req = new ActiveXObject("Microsoft.XMLHTTP");
               if (req) {
                       req.onreadystatechange = processReqChange;
                       req.open("GET",url,true); //abre a requisição para o arquivo php que pesquisará o estado
                       req.send();
               }
       }
       destino_retorno = destino;
}

function processReqChange() {
       if (req.readyState == 4) { // apenas quando o estado for "completado"
               if (req.status == 200) { // apenas se o servidor retornar "OK"
                       document.getElementById(destino_retorno).innerHTML = req.responseText;
               } else {
                       alert("Houve um problema ao obter os dados:n" + req.statusText);
               }
       } else if (req.readyState == 1) {
               document.getElementById(destino_retorno).innerHTML = '<span style="font-family:Arial;color:#666666;">Carregando</span>';        
       }
}

   function preenche() {
     var random = Math.random();
     var url = "http://www.meusite.com.br/lista.php?nocache="+ random +""; //monta a url que será "processada" pelo ajax
     ajax(url,"meio"); //devolve a resposta no "campo" + id. Ou seja campo1, campo2, campo300
   }
       </script>
               <style>
               body{
                                       background:url(fundo.png) repeat;
                                       color:#F60;
                                       font-family: helv, Verdana, Arial, sans-serif;
                                       font-weight:bold;
                                       font-size:14px;
                                       width:520px;
                                       height:600px;}
                                       #gadgetContent{ margin-left:0px;}
                                       #topo{ background:url(topo.png); height:28px; width:500px;}
                                       #meio-1,#meio{ background:url(meio.png) repeat; padding-left:15px; width:500px;}
                                       #meio-1{ padding-left:100px;}
                                       #texto{ width:300px; text-align:center;}
                                       #meio{ height:300px; padding-top:50px;}
                                       #baixo{ background:url(baixo.png); height:28px; width:500px;}
                                       .texto_link a { text-decoration:none; color:#F60; font-size:16px; height:35px;}
               </style>
                       </head>
                       <body onload="preenche()">
                           <div id="gadgetContent">
               <div id="meio-1"><img src="logo.png" width="300px" height="150px;" /></div>
               <div id="meio"></div>
               <div id="baixo"></div>
                           </div>
                       </body>

                       </html>

[]'s

augustoclaro · Janeiro 10, 2011

Se isso não funcionar, você pode fazer um setInterval para verificar a cada x milesimos de segundo se mudou o conteúdo

Patrique · Janeiro 10, 2011

Com o método no cache não há erro, ele é bastante utilizado para este tipo de situação, uma vez que o resultado pode vir do cache do usuário e assim não ser o atualizado, mas fazendo da forma que passei ele "burla" forçando a página ser novamente carregada do zero.

[]'s

augustoclaro · Janeiro 10, 2011

Não sabia dessa...

Eu sempre vi em códigos passando números random por querystring mas nunca soube pra que serve..

Obrigado por explicar!

Kanzen · Janeiro 10, 2011

Muito obrigado pessoal, agora ele esta atualizando certinho toda vez que eu abro o/

agora eu só fiquei na dúvida de como fazer de x em x minutos ele atualizar

pelo q eu procurei seria com um setTimeout(preenche(),5000); mas não sei qual a melhor maneira de ficar executando

Patrique · Janeiro 10, 2011

Pode ser tanto por setInterval como com setTimeout, os dois tem o mesmo sentido.

Vai ai um tuto simples de ambos: http://rogeriolino.wordpress.com/2006/12/19/javascript-settimeout-e-setinterval/

[]'s

Kanzen · Janeiro 12, 2011

tentei um código aqui mas não deu muito certo.

Preciso setar para executar o 'preenche()' no <body onload="preenche()"> mas depois preciso ficar chamando a função de x em x minutos que é para verificar se houve atualização na pagina

Patrique · Janeiro 12, 2011

Poste como esta tentando.

Arquivado

JS retornando conteúdo de uma pag

Recommended Posts

Kanzen 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Eliseu M. 2

Compartilhar este post

Link para o post

Compartilhar em outros sites

Kanzen 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Patrique 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

augustoclaro 2

Compartilhar este post

Link para o post

Compartilhar em outros sites

Patrique 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

augustoclaro 2

Compartilhar este post

Link para o post

Compartilhar em outros sites

Kanzen 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Patrique 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Kanzen 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Patrique 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fixar div até atingir uma certa altura

Ajuda com Extends e envio para o banco

PHP+Codeginiter - Orientação para Impressão

Fóruns

Tempo Real

Informação importante