gbaptista / luminous

Identify, analyze and block code execution and event collection through JavaScript in your browser with code interception.
https://gbaptista.github.io/luminous
GNU General Public License v3.0
96 stars 11 forks source link
chrome chromium debugger firefox freedom interceptor javascript monitor opera performance privacy webextension

Luminous: Bloqueador de eventos JavaScript Icon

en-US | es | pt-BR

Uma extensão experimental para identificar, analisar e bloquear a execução de códigos e a coleta de eventos via JavaScript em seu navegador.

Por quê?

Existem projetos incríveis como o Lightbeam, NoScript, ScriptSafe, uBlock Origin, HTTPS Everywhere e diversos outros. Todos possuem a proposta de identificar e/ou impedir a execução de códigos e requisições questionáveis.

Tais ferramentas são vitais, mas inevitavelmente precisamos fazer concessões para conseguir acessar muitos sites já que a utilização de JavaScript é massiva na web. Ao acessar por exemplo o Google Tradutor, utilizando um combo de 3 extensões (HTTPS Everywhere, uBlock Origin e ScriptSafe) com a Luminous temos o seguinte resultado após um breve momento de utilização do website:

Icon

É sobre este número (7,6 mil) que estamos perdidos e de mãos atadas, é alí que não sabemos o que acontece e ainda não temos a liberdade de decidir o que pode e o que não pode ser executado. Este é o principal objetivo do projeto, preencher esta lacuna e conseguir ver e controlar o que acontece. Como efeito colateral acabamos tendo também uma ferramenta interessante que ajuda no desenvolvimento de códigos em JavaScript ao nos dar visibilidade sobre o que está acontecendo.

Entendendo a interface do usuário

Interface Overview

Como instalar

Experimente!

Instale a extensão e acesse a nossa página de demonstração para experimentar e entender melhor o seu funcionamento: Demo Page

Capturas de tela

Veja algumas capturas de tela aqui.

Se aprofunde no tema

Guias

Guias são documentos sobre assuntos muitos específicos onde podemos ir fundo nos detalhes e encontrar facilmente as informações que estamos procurando. Veja aqui todos os guias.

Como colaborar

Espalhe a ideia

Escreva algum guia

Colabore escrevendo algum guia sobre assuntos relacionados ao projeto.

Compartilhe

Conte aos seus amigos, familiares e colegas de trabalho sobre como a extensão foi utilizada para melhorar a sua experiência na web e os ensine a utilizá-la também!

Escreva e fale sobre

Descobriu que algum site estava invadindo a sua privacidade? Conseguiu bloquear eventos que não desejava? Conseguiu facilitar o desenvolvimento do seu código ou a depuração de erros? Grave um video, prepare uma palestra, escreva um artigo ou qualquer coisa do gênero contando como foi feito, explicando como a extensão o ajudou e mostrando as possibilidades.

Ajude na tradução para outros idiomas

Traduza os arquivos .md encontrados dentro do diretório doc/ e os arquivos .json dentro do diretório _locales/ para o seu idioma e nos ajude a atingir mais pessoas!

Reporte problemas

Problemas em sites específicos

Teve problemas ao acessar algum site por causa da extensão? Ficou lento? Causou erros? O site parou de funcionar? Nem todos os eventos foram identificados? Abra uma issue e conte pra gente sobre o que aconteceu.

Problemas em algum navegador

Abra uma issue se algo não funcionou como você esperava em algum navegador. Queremos que tudo funcione bem em todos os navegadores possíveis!

Bote a mão na massa

Ajude a melhorar a interface do usuário

Não temos a interface mais bonita e amigável possível. Discussões e propostas sobre uma nova interface ou melhorias na já existente (html/interface-sample.html) serão muito bem-vindas! Não subestime o poder desse tipo de colaboração: better_errors#6 - better_errors#22

Melhore o desempenho

Exemplo 1: Quanto mais cedo conseguirmos injetar o código nos websites e quanto menos recursos utilizarmos para processar as informações, mais execuções seremos capazes de identificar e melhor será a nossa experiência ao ter uma extensão que não deixe a navegação lenta.

Olhe por exemplo para a nossa página de demonstração (html/demos/detections/index.html):

(function() { setTimeout(function() {
  // JavaScript code...
}, 100); })();

Esse delay de 100 milessegundos existe pois sem ele o código é executado rápido demais e não conseguimos interceptá-lo. Como podemos melhorar isso para não precisarmos desse delay ou então conseguir diminuí-lo?

Exemplo 2: Capturamos apenas um pedaço da função interceptada, pois ela pode ser muito grande e deixar a leitura das informações lenta (js/content/interceptor.js):

listener: ('' + listener).slice(0, 400)

Como podemos melhorar isso? Essa é a melhor maneira de lidar com este problema?

Exemplo 3: A maneira que encontramos de passar mensagens do contexto do documento para o contexto da extensão foi realizando o parser dos dados em JSON lendo um elemento HTML (js/content/readers/data.js):

render_data(
  JSON.parse($(data_element).html()),
  tab_id
);

Existem alternativas? Fazer o parse das informações constantemente é a melhor opção?

Crie novas funcionalidades

Começamos com uma ideia básica: identificar e bloquear eventos. Podemos expandir essa ideia, alguns pensamentos que já surgiram:

Melhore a qualidade do código

Este é um projeto experimental que cresceu de forma descontrolada, não temos um padrão definido de nomenclatura, uma forte organização baseada em algum design pattern ou testes automatizados. Discussões para melhorar a qualidade do código nesse sentido serão muito bem-vindas!

Problemas conhecidos

Sem soluções alternativas

Com soluções alternativas

Service Workers no Mozilla Firefox

No Mozilla Firefox e derivados, alguns sites que utlizam Service Workers (como o WhatsApp Web) podem bloquear o código de interceptação por conta de um bug na interceptação dos headers com as diretrizes de Content-Security-Policy. A solução alternativa atual consiste em recarregar o Service Worker:

Entendendo o código

Background

js/background:

Content

/content/injections:

/content/readers:

/content/injections_controller.js: Responsável por tomar decisões sobre a injeção de códigos.

/content/interceptor.js: Responsável por interceptar execuções de códigos JavaScript no contexto do documento e coletar detalhes sobre elas.

Pop-up

Responsáveis por renderizar e cuidar das interações feitas no pop-up que é aberto ao clicar no ícone da extensão:

Configurações

Responsáveis por renderizar e cuidar das interações feitas nas páginas de configurações:

Utilidades

Bibliotecas de terceiros

Licença

Este projeto está licenciado sob a GPLv3.

Doações

Não há nenhum tipo de organização para o recebimento de doações no momento. Veja nosso guia sobre "como colaborar" para outras maneiras de contribuição. Se deseja realmente realizar uma doação, eis algumas fundações incríveis que vão de encontro com os temas abordados neste projeto que você pode ajudar: