Carregando um JavaScript em qualquer site

Passei minhas últimas madrugadas fazendo testes de segurança com javascript, e descobri umas coisas que achei interessantes. Desde que mudei para São Paulo comecei a trabalhar apenas com interface, isso me fez aprender muito sobre javascript, tomar alguns cuidados com performance e agora resolvi dar uma olhada em "segurança no front-end", se é que isso existe.

Quando eu falo de "segurança no javascript" me refiro a possibilidade de manipular o script da página para fazer alguma coisa que ela não está aguardando que seja feita, por isso vale relembrar que todo o processo de segurança e validação deve ser feito no back-end.

Bem, você deve saber que é possível executar um código javascript em uma página através da URL, para isso você só precisa digitar no campo de URL do navegador o comando javascript antecedido por "javascript:".

Por exemplo, aqui mesmo no O Desenvolvedor, digite o seguinte na url do seu navegador:

javascript:alert("DONT PANIC!");

Qualqur código js será interpretado quando colocado na linha de url do site, seria como um link no site com o comando "javascript:". Sabendo disso você sabe que é possível:

  1. Chamar qualquer função do código do site
  2. Criar e manipular funções do js (validação,posts,etc.)
  3. Manipular o DOM (inputs,action,methods)

Aí entra a minha curiosidade: existem plataformas onde o javascript pode fazer requisições que executam funções no back-end (insert,delete,update) e se isso não for validado e o usuário tiver um pouco de conhecimento do sistema, poderá executar funções malignas, penso eu. Ainda não testei.

Mas o motivo do post não é mostrar que é possível executar comandos através da url do navegador, é mostrar que é possível carregar um javascript hospedado em qualquer lugar e fazer com que ele seja interpretado pelo site que você está navegando.

Carregando um javascript em qualquer site

Utilizando a url do navegador vamos manipular o <head> da página e fazer com que ela carregue o jQuery, por exemplo. Vou primeiro colocar o código do "load", depois transformar ele em uma única linha para que seja colocado no navegador.

//criamos um <script> e setamos o tipo e a url
var script=document.createElement("script");
script.type="text/javascript";
script.src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js";

//manipulamos o <head> do site para inserir o script
document.getElementsByTagName("head")[0].appendChild(script);

 

Simples, se você colocar isso em qualquer .js do seu site ele irá carregar o jQuery do Google libraries. Para fazer isso através em qualquer site que você esteja navegando é só digitar o seguinte no campo de url (com o site carregado no seu navegador):

javascript:var%20script=document.createElement("script");script.type="text/javascript";script.src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js";document.getElementsByTagName("head")[0].appendChild(script);void(0);

A única diferença do bloco de código anterior é o void(0);, que serve unicamente para o navegador não entender seu comando com uma chamada para uma url e tentar abrir uma nova página.

Pronto, agora o site que você está visualizando tem a biblioteca jQuery funcionando.

Algumas curiosidades que descobri:

  1. Se o caminho do javascript que você tentar carregar for no seu computador "///file..." OU em um localhost (rodando servidor na sua máquina) ele será carregado no DOM porém não será interpretado
  2. Para o problema anterior não adianta simular um domínio apontando para o localhost (através do hosts do Windows), ele vai continuar carregando o javascript no DOM mas não interpretando

Então o jeito para carregar um JS externo é hospedar em algum servidor e fazer a chamada para o arquivo hospedado. Todos os testes foram feitos no Windows Seven com Firefox 3.6.

 

Opinião

Agora eu quero a opinião dos leitores, o que vocês acham deste lance de segurança no front-end? Uma babaquice? Perigoso? É necessário se preocupar?

Comentem, estou curioso sobre estas coisas e queria saber até que ponto vocês acham que pode ser perigoso a manipulação de uma página por scripts externos...

Ir para o topo