Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Jackson Junior

Ajax com PHP Sem XmlHttpRequest

Por , em PHP

Recommended Posts

Jackson Junior    1

Jackson Junior
Postado

E ae Familia Imasters, beleza???

 

Esse post eh pra ensinar a fazer AJAX sem o objeto XmlHttpRequest.

O primeiro exemplo eh pra fazer requisições internas e o segundo requisições externas.

Espero q gostem!!!

 

Exemplo 01 - Requisição Interna

 

page1.php -> Pagina que será visualizad sem refresh

<?php$html = 'O AJAX foi executado com sucesso sem<br> o auxilio do XmlHttpRequest Object<br><a href=\"index2.htm\">Executar AJAX Requisição Externa</a>';?>div = document.getElementById('interno');div.innerHTML = '<?php echo $html; ?>';

engine.js -> arquivo que faz a magica

// pega a url baseurl = document.location.href;xend = url.lastIndexOf("/") + 1;var base_url = url.substring(0, xend);function ajax_do (url) {		// verifica se a url inicia com http		if (url.substring(0, 4) != 'http') {				url = base_url + url;		}		// cria um novo elemento JS		var jsel = document.createElement('SCRIPT');		jsel.type = 'text/javascript';		jsel.src = url;		// Adiciona o elemento JS (portanto executando a chamada "AJAX)		document.body.appendChild (jsel);}

index.htm -> pagina que executa o AJAX Requisição Interna

<html>	 <head>			 <title>Aprendendo a Usar AJAX sem XmlHttpRequest Object</title>			 <script type="text/javascript" src="engine.js"></script>	 </head>	 <body style="font: 12px Tahoma; color:#003399; font-weight:bold">	 <center><input type="button" onclick="ajax_do ('page1.php');" value="Executar AJAX - Requisição Interna" /></center>	 <center>O Conteudo aparecerá abaixo dessa linha</center><br><br>	 <div id="interno" style="font: 12px tahoma; text-align:center; color:#FF0000; font-weight:bold;"><br>	 </div>	 </body></html>

 

Exemplo 02 - Requisição Externa

 

Nesse segundo exemplo, foi implementado uma nova funcao no engine.js

e um arquivo que verifica e trata o arquivo externo. Segue abaixo.

 

index2.htm -> pagina que executa o AJAX Requisição Externa

<html>	<head>	<title>Aprendendo a Usar AJAX sem XmlHttpRequest Object</title>	<script type="text/javascript" src="engine.js"></script>	</head>	<body style="font: 12px Tahoma; color:#003399; font-weight:bold">	<center><input type="button" onclick="ajax_get ('http://www.imasters.com.br','externo');" value="Executar AJAX - Requisição Externa" /></center>	 <center>O Conteudo aparecerá abaixo dessa linha<br><a href="index.htm">Executar AJAX - Requisição Interna</a></center><br><br>	 <div id="externo" style="font: 12px tahoma; text-align:center; color:#FF0000; font-weight:bold;"><br>	 </div>	 </body></html>

engine.js -> arquivo que faz a magica implementado

// funcao utilizada no exemplo anterior// pega a url baseurl = document.location.href;xend = url.lastIndexOf("/") + 1;var base_url = url.substring(0, xend);function ajax_do (url) {		// verifica se a url inicia com http		if (url.substring(0, 4) != 'http') {				url = base_url + url;		}		// cria um novo elemento JS		var jsel = document.createElement('SCRIPT');		jsel.type = 'text/javascript';		jsel.src = url;		// Adiciona o elemento JS (portanto executando a chamada "AJAX)		document.body.appendChild (jsel);}// Funcao que faz a requisição do arquivo externo// Pega conteudo externofunction ajax_get (url, el) {	// Verifica se o elemento passado eh um objeto ou uma id-string?	if (typeof(el) == 'string') {		el = document.getElementById(el);	}	// Valida el	if (el == null) { return false; }	// verifica se a url inicia com http	if (url.substring(0, 4) != 'http') {		url = base_url + url;	}	// Cria a URL a ser requisitada	getfile_url = base_url + 'getfile.php?url=' + escape(url) + '&el=' + escape(el.id);	// Ajax em acao	ajax_do (getfile_url);	return true;}

getfile.php -> arquivo que verifica e trata o arquivo externo

<?php// recebe a URL e a divif (!isset($_GET['url'])) { die(); } else { $url = $_GET['url']; }if (!isset($_GET['el'])) { die(); } else { $el = $_GET['el']; }// Verifica se a URL comeca com httpif (substr($url, 0, 4) != 'http') {		// Mensagem de erro		echo 'alert(\'Erro de segurança:; URL Incorreta!\');';		die();}// Tenta e pega o conteudo$data = @file_get_contents($url);if ($data === false) {		// Set error		echo 'alert(\'Não foi possivel localizar "' . $url . '"\');';		die();}// Escape dos dados$data = str_replace("'", "\'", $data);$data = str_replace('"', "'+String.fromCharCode(34)+'", $data);$data = str_replace ("\r\n", '\n', $data);$data = str_replace ("\r", '\n', $data);$data = str_replace ("\n", '\n', $data);?>el = document.getElementById('<?php echo $el; ?>');el.innerHTML = '<?php echo $data; ?>';
Veja o Resultado: AJAX sem XmlHttpRequest Object

 

Eh isso ai. Espero que seja util pra vcs como esta sendo pra mim.

-------------------------------------------

http://forum.imasters.com.br/public/style_emoticons/default/joia.gif http://forum.imasters.com.br/public/style_emoticons/default/joia.gif http://forum.imasters.com.br/public/style_emoticons/default/joia.gif http://forum.imasters.com.br/public/style_emoticons/default/joia.gif http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

Wilker    3

Wilker
Postado

e pq n usar XMLHttp??afinal, ele foi feito pra isso, e a maioria dos browsers de hj tem suporte a ele...sem falar q ele n faz akele "tec" qdo pega algum conteudo (esse seu faz)

Compartilhar este post

Link para o post
Compartilhar em outros sites

[VAZA]    0

[VAZA]
Postado

O maior problema do XMLHttp é com relação aos caracteres iso-8859-1.outra coisa..ao invés de na page1.php, quiser passar um conteudo completo ao inves de passar um valor que tem em uma variavel..como faço?Abraços,t+

Compartilhar este post

Link para o post
Compartilhar em outros sites

Wilker    3

Wilker
Postado

kra, n tem problema nenhum com acentos, passe em modo post dando um escape(), q vai passar td perfeitoa sim, e qto a PEGAR dados, com o PHP você da um utf8_encode() q o texto tb chega perfeito pro JS

Compartilhar este post

Link para o post
Compartilhar em outros sites

[VAZA]    0

[VAZA]
Postado

Com utf8_encode a padronização fica uma "BELEZUERA" né...imagina..passar todas as paginas colocando essa função.E outra..e se eu nao quiser passar modo post? quiser GET?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Wilker    3

Wilker
Postado

c quizer get eh soh encodar a URL do mesmo jeito com escape, e qto a ter q colocar o utf8_encode() em todas as paginas, eh soh criar uma pagina PHP padrao para pegar as outras paginas, oq alem de ser funcional, eh + seguro q pegar paginas diretamente

Compartilhar este post

Link para o post
Compartilhar em outros sites

Wilker    3

Wilker
Postado

vo escreva uma bem simples aqui pra você:

 

<?php$pag = @$_GET["pag"];$path = "conteudo/" . $pag . ".php";if(!file_exists($pag)) {	die(utf8_encode("<span style='color: #F00; font-weight: bold;'>Página não encontrada</span>"));}ob_start();include($path);$texto = ob_get_clean();$texto = addslashes($texto);$texto = preg_replace("/(\r\n|\r|\n)/", '\r\n', $texto);echo utf8_encode($texto);?>

no kso, as paginas estao na pasta conteudo, entao o script recebe o agumento GET com nome "pag", e procura a pagina, assim ele soh carrega c estiver ali

 

e pq n usar file_get_contents()??

 

simples, pq c houver codigo PHP embutido, o file_get_contents() vai exibir o PHP no lugar de processalo...

 

entao oq c faz, a funcao ob_start(), grava todo o buffer de saida (conteudo que deveria ser escrito) no lugar de escrever, e depois com a linha

 

$texto = ob_get_clean();

 

eu jogo esse conteudo na variavel $texto e ao mesmo tempo eu limpo esse buffer (pra o conteudo nunca chegar a ser escrito na tela)

 

e depois eu faco processamentos pra passar esse texto pro JS

 

primeiro eu do um addslashes, pra n confundir a aspas no JS, depois eu removo linhas, trocando por caractere especial (c você tentar usar um callback no js com string de multiplas linhas vai dar pau), e depois eu finalmente escreve o conteudo dando um utf8_encode()

 

eh isso, assim você carrega paginas com Ajax sem problema nenhum

Compartilhar este post

Link para o post
Compartilhar em outros sites

Wilker    3

Wilker
Postado

soh pra mandar tb, a minha API completa, ela faz parte do meu Framework para sites em Ajax, ela usa o Smarty Templates para carregar templates, pasta separada para processamento de pagina, eh uma organizacao + sofisticada, o meu codigo original eh esse:

 

<?php//inicializacaorequire("include/conf.php");require("smarty/Smarty.class.php");session_name(SESSION_NAME);session_start();$smarty = new Smarty;$pag = @$_GET["pag"];if(!file_exists("templates/{$pag}.html")) {	die(utf8_encode("+:<span style='color: #F00; font-weight: bold;'>Página não encontrada</span>"));}if(USE_MYSQL) {	@mysql_connect(HOST_MYSQL, USER_MYSQL, PASS_MYSQL) or die(utf8_encode("-:Não foi possivel conectar ao banco de dados"));	@mysql_select_db(DB_MYSQL) or die(utf8_encode("-:Não foi possivel selecionar o banco de dados"));}//verificar se é pagina de administraçãoif(preg_match("/^adm_/i", $pag)) {	if(!$_SESSION["adminID"]) {		die(utf8_encode("+:Você não está autorizado a ver essa página"));	}}//executar processamentoif(file_exists("processamento/{$pag}.php"))	include("processamento/{$pag}.php");//finalizacao$texto = $smarty->fetch("{$pag}.html");$texto = addslashes($texto);$texto = preg_replace("/(\r\n|\r|\n)/", '\r\n', $texto);echo utf8_encode("+:" . $texto);?>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Wilker    3

Wilker
Postado

da pra passar sim, por exemplo, pra passar + argumentos por GET você faria assim (vamos supor q o nome do arquivo q eu passei é loader.php):

 

carregando a pagina "noticias" passando a variavel "id"

 

loader.php?pag=noticias&id=5

 

e por ai vai, você pode passar qtos argumentos GET você quizer (se n existir o limite da barra do browser / restricao do servidor logicamente ;) )

 

ai na pagina noticia.php você poderia fazer algo tipo:

 

<?$id = $_GET["id"];$query = mysql_query("select * from noticias where id={$id}");$dados = mysql_fetch_assoc($query);print_r($dados);?>

mesmo sendo arquivo separado, pelo fato dele estar sendo incluido, todas as variaveis q existem no arquivo loader.php antes da inclusao passam a fazer parte do arquivo incluido tb (isso eh logica de programacao neh, afinal, incluir um arquivo eh como copiar / colar o codigo nakele treco do codigo)

 

qq outra duvida pode postar ai ;)

Compartilhar este post

Link para o post
Compartilhar em outros sites

Wilker    3

Wilker
Postado

nao, você vai abrir essa pagina com o Ajax neh kra...

 

tipo, na minha framework eu ja fiz td, qdo eu quero uma pagina uma simples funcao do javascript ja abre td certo, eu soh faco:

 

loadPage("noticias");

 

e pronto, a pagina eh carregada com ajax... resta a você criar seus meios ai n kra, por ajax direto seria akele veio negocio...

 

var ajax = ajaxInit();

...

document.getElementById("conteudo").innerHTML = ajax.responseText;

...

 

ai eh você q tem q trabalhar ai pra desenvolver seus meios ;)

 

tipo, o meu framework eu vo publica qdo eu achar q ele esta estavel (ainda eh beta, mas ja desenvolvi alguns sites com ele)

 

sites q estao eh desenvolvimento com o framework:

 

http://www.faculdadeguararapes.edu.br/site/complexo/fg2006/

http://www.faculdadeguararapes.edu.br/site...ilker/onepiece/

 

alem desses 2 sites tb tem uns aplicativos web q eu desenvolvi com a API, mas esses estao em uso, com excecao de 1 q eu vo coloca abaixo e você pode testar

 

http://www.faculdadeguararapes.edu.br/site...l/wilker/aulas/

 

login: wilker

senha: teste123

 

esse sistema eh um sistema drag & drop para organizar o horario das aulas do colegio (selecione a serie, depois arraste os professores para a tabela)

 

com execao do Smarty Templates (pra separar o codigo PHP do HTML), a framework eh 100% minha (todos os javascripts sao de minha autoria, e os PHP fora o Smarty tb sao todos de minha autoria)

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos PHP
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito