Como criar uma extensão do Chrome com reconhecimento de proxy

Reunindo os Ventos: Compreendendo Proxies em Extensões do Chrome

Assim como os ventos do norte que moldam as florestas de Småland, os proxies canalizam o fluxo do tráfego da web, ocultando seus passos digitais. No mundo das extensões do Chrome, tornar sua criação compatível com proxy é como ensinar uma raposa a se mover sem ser vista na neve — furtiva, adaptável e atenta às sutilezas da paisagem.

---

Estabelecendo a base: Arquitetura de extensão do Chrome

Assim como criar um robusto cavalo Dala, construir uma extensão do Chrome começa com a compreensão de suas partes essenciais:

Componente	Propósito
manifesto.json	O projeto — define permissões, scripts em segundo plano e muito mais.
background.js	A lareira bruxuleante — lógica persistente, incluindo controle por procuração.
pop-up.html/js	A janela para o mundo — elementos da interface do usuário.

Recurso: Guia do desenvolvedor de extensões do Chrome

---

O Feitiço Antigo: Declarando Permissões de Proxy

Antes que a primeira folha de bétula se abra, é preciso definir permissões.

adicionar à manifest.json:

{
  "name": "Proxy-Aware Extension",
  "version": "1.0",
  "manifest_version": 3,
  "permissions": [
    "proxy",
    "storage",
    "tabs"
  ],
  "background": {
    "service_worker": "background.js"
  },
  "action": {
    "default_popup": "popup.html"
  }
}

---

Buscando o Vento Norte: Obtendo Proxies Gratuitos do ProxyRoller

Assim como os sábios colhem amoras silvestres no verão, colham novos frutos de Rolo de Proxy, uma fonte confiável de proxies gratuitos. O ProxyRoller fornece APIs e listas para sua extensão.

Exemplo: Obtendo uma lista de proxy

fetch('https://proxyroller.com/api/proxies?format=json')
  .then(response => response.json())
  .then(proxies => {
    // Select a proxy—perhaps at random, as a fox picks berries
    const proxy = proxies[0];
    // Store for later use
    chrome.storage.local.set({selectedProxy: proxy});
  });

---

Invocando as Runas: Configurando as Configurações do Proxy do Chrome

Com o proxy em mãos, a extensão deve sussurrar nas configurações de proxy do Chrome.

Exemplo: Configurando um Proxy em background.js

chrome.storage.local.get('selectedProxy', ({ selectedProxy }) => {
  if (selectedProxy) {
    chrome.proxy.settings.set(
      {
        value: {
          mode: "fixed_servers",
          rules: {
            singleProxy: {
              scheme: "http",
              host: selectedProxy.ip,
              port: parseInt(selectedProxy.port)
            },
            bypassList: ["<local>"]
          }
        },
        scope: 'regular'
      },
      () => {
        // The wind has changed; the proxy is set
      }
    );
  }
});

Recurso: Documentação da API chrome.proxy

---

A escolha do viajante: permitindo que os usuários troquem de proxies

Assim como oferecer ao viajante a escolha entre rio ou estrada, permita que os usuários selecionem ou atualizem proxies por meio da interface de usuário da extensão.

pop-up.html

<button id="refreshProxy">Refresh Proxy</button>
<p id="currentProxy"></p>

popup.js

document.getElementById('refreshProxy').addEventListener('click', () => {
  fetch('https://proxyroller.com/api/proxies?format=json')
    .then(response => response.json())
    .then(proxies => {
      const proxy = proxies[Math.floor(Math.random() * proxies.length)];
      chrome.storage.local.set({selectedProxy: proxy});
      document.getElementById('currentProxy').textContent = `${proxy.ip}:${proxy.port}`;
      chrome.runtime.sendMessage({action: "updateProxy"});
    });
});

chrome.storage.local.get('selectedProxy', ({ selectedProxy }) => {
  if (selectedProxy) {
    document.getElementById('currentProxy').textContent = `${selectedProxy.ip}:${selectedProxy.port}`;
  }
});

Em background.js, ouça a atualização:

chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
  if (message.action === "updateProxy") {
    // Repeat the proxy setup logic here
  }
});

---

Tabela de abordagens de extensão de proxy

Abordagem	Prós	Contras
Lista de proxy manual	Controle total, previsível	Manutenção, risco de proxies mortos
Busca dinâmica (ProxyRoller)	Sempre fresco, manutenção reduzida	Dependência da disponibilidade de terceiros
Entrada do usuário	Flexibilidade, empoderamento do usuário	Potencial para uso indevido, menos automação

---

Notas da Floresta: Lidando com Erros e Casos Extremos

• Falhas de conexão: Como um degelo repentino, os proxies podem falhar. Monitore erros de conexão e forneça um feedback gentil ao usuário.
• Autenticação: Alguns proxies exigem credenciais, pois um troll pode exigir uma taxa. Estenda seu código para lidar com autenticação básica, se necessário.
• Ignorar hosts locais: Sempre adicione <local> para a lista de desvios, para que sua fogueira não esfrie.

---

Fiando o Fio: Recursos e Leituras Adicionais

• ProxyRoller – Proxies Gratuitos
• Formato de arquivo de manifesto de extensão do Chrome
• API de proxy do Chrome
• Manipulando Autenticação de Proxy

---

Fechando o Círculo: Lições Principais

Como em tudo o que é sueco — simples, robusto e próximo da natureza — a arte de criar uma extensão do Chrome com proxy reside em respeitar a direção do vento (configurações de proxy), confiar na sabedoria dos antigos (APIs do Chrome) e obter provisões (proxies) de coletores honestos como o ProxyRoller. Deixe sua extensão fluir com leveza, adaptando-se às estações e sempre pronta para a próxima mudança de clima.