Depois de ler a seção Começar, use este guia como um resumo dos componentes de extensão, das funcionalidades deles e de como combiná-los. Primeiro, saiba o que as extensões podem fazer: Em seguida, aprenda a combinar esses recursos usando a seção conceitos básicos das extensões.

Projetar a interface do usuário

A maioria das extensões precisa de algum tipo de interação do usuário para funcionar. Com a plataforma de extensões, você tem várias maneiras de adicionar interações à sua extensão. Esses métodos incluem pop-ups acionados pela barra de ferramentas do Chrome, painéis laterais, menus de contexto e muito mais.
Use a API browser.sidePanel para hospedar conteúdo no painel lateral do navegador ao lado do conteúdo principal de uma página da Web.
Controla a exibição do ícone de uma extensão na barra de ferramentas.
Adicione itens ao menu de contexto do Google Chrome.
Mostrar mais

Controlar o navegador

As APIs de extensão do Chrome possibilitam mudar a forma como o navegador funciona.
As substituições de configurações são uma maneira de as extensões modificarem as configurações selecionadas do Chrome. Além disso, as extensões podem usar páginas de substituição HTML para substituir uma página que o Google Chrome normalmente fornece. Uma extensão pode substituir o gerenciador de favoritos, a guia "Histórico" ou a nova guia.
As extensões do DevTools adicionam funcionalidades ao Chrome DevTools acessando APIs de extensão específicas do DevTools em uma página do DevTools adicionada à extensão. Você também pode usar a API browser.debugger para invocar o protocolo de depuração remota do Chrome. Anexe a uma ou mais guias para instrumentar a interação de rede, depurar JavaScript, fazer mutações no DOM e muito mais.
A API browser.notifications permite criar notificações usando modelos e mostrar essas notificações aos usuários na bandeja do sistema.
Use a API browser.history para interagir com o registro de páginas visitadas do navegador e a API browser.browsingData para gerenciar outros dados de navegação. Use browser.topSites para acessar os sites mais visitados.
Use APIs como browser.tabs, browser.tabGroups e browser.windows para criar, modificar e organizar o navegador do usuário.
Use a API browser.commands para adicionar atalhos de teclado que acionam ações na sua extensão. Por exemplo, você pode adicionar um atalho para abrir a ação do navegador ou enviar um comando para a extensão.
Use a API browser.identity para receber tokens de acesso do OAuth 2.0.
A API browser.management oferece maneiras de gerenciar a lista de extensões instaladas e em execução. Isso é especialmente útil para extensões que substituem a página "Nova guia" integrada.
A API browser.omnibox permite registrar uma palavra-chave com a omnibox (barra de endereço) do Google Chrome.
Use a API browser.privacy para controlar o uso de recursos no Chrome que podem afetar a privacidade de um usuário. Consulte também a API browser.proxy para gerenciar as configurações de proxy do Chrome.
Use a API browser.downloads para iniciar, monitorar, manipular e pesquisar downloads de maneira programática.
Use a API browser.bookmarks e a API browser.readingList para criar, organizar e manipular essas listas.

Controle a Web

Altere dinamicamente o conteúdo e o comportamento das páginas da Web. É possível controlar e modificar a Web injetando scripts, interceptando solicitações de rede e usando APIs da Web para interagir com páginas.
Scripts de conteúdo são arquivos executados no contexto de páginas da Web. Eles usam o Modelo de objeto de documentos (DOM) padrão para ler detalhes de páginas da Web acessadas pelo navegador, fazer alterações e transmitir informações para a extensão pai.
A permissão "activeTab" concede à extensão acesso temporário à guia ativa no momento quando o usuário invoca a extensão, por exemplo, clicando na ação. O acesso à guia dura enquanto o usuário está nessa página e é revogado quando ele sai ou fecha a guia.
Use as APIs browser.declarativeNetRequest, browser.webRequest e browser.webNavigation para observar, bloquear e modificar solicitações de rede.
Saiba mais sobre diferentes abordagens para gravar áudio e vídeo de uma guia, janela ou tela usando APIs da plataforma Web, como browser.tabCapture ou getDisplayMedia().
Use a API browser.contentSettings para controlar se os sites podem usar recursos como cookies, JavaScript e plug-ins. De modo geral, as configurações de conteúdo permitem personalizar o comportamento do Chrome em cada site, em vez de globalmente.

Conceitos básicos

Com as APIs de plataforma da Web e extensão, você pode criar recursos mais complexos combinando diferentes componentes de IU e recursos da plataforma de extensões.
Um service worker de extensão (service-worker.js) é um script baseado em eventos executado em segundo plano pelo navegador. Muitas vezes, é usado para processar dados, coordenar tarefas em diferentes partes de uma extensão e como gerente de eventos da extensão.
Entenda as permissões: como elas funcionam e quando evitar pedir quando não forem necessárias.
Existem várias maneiras de implementar a filtragem de conteúdo e de rede nas extensões do Chrome. Saiba mais sobre os recursos de filtragem de conteúdo disponíveis para as extensões e as diferentes abordagens, técnicas e APIs de filtragem que podem ser usadas pelas extensões do Chrome.
Muitas vezes, os scripts de conteúdo ou outras páginas de extensão precisam enviar ou receber informações do service worker de extensão. Nesses casos, qualquer um dos lados pode ouvir as mensagens enviadas da outra extremidade e responder no mesmo canal.
Ative suas extensões para trocar mensagens com aplicativos nativos.
No Manifest V3, as extensões precisam agrupar todo o código que estão usando dentro da própria extensão. Existem diferentes estratégias para fazer isso.
As extensões do Chrome têm uma API Storage especializada, disponível para todos os componentes de extensão. Ele inclui quatro áreas de armazenamento separadas para casos de uso específicos e um listener de eventos que rastreia sempre que os dados são atualizados.
Service workers não têm acesso ao DOM. A API Offscreen permite que a extensão use APIs DOM em um documento oculto sem interromper a experiência do usuário abrindo novas janelas ou guias.
O isolamento de origem cruzada permite que uma página da Web use recursos avançados, como o SharedArrayBuffer. Uma extensão pode ativar o isolamento de origem cruzada especificando os valores apropriados para as chaves de manifesto "cross_origin_embedder_policy" e "cross_origin_opener_policy".
Saiba como o Chrome atualiza o fluxo de atualização das extensões e como monitorar a distribuição dessas atualizações.

Mais tópicos