O que é uma extensão do Firefox?
Extensões adicionam novas funcionalidades às aplicações da Mozilla, como Firefox e Thunderbird. Elas podem adicionar qualquer coisa a partir de um botão de barra de ferramentas para uma nova funcionalidade completamente. Elas permitem que o aplicativo possa ser personalizado para atender às necessidades pessoais de cada usuário, se ele precisar de recursos adicionais, mantendo as pequenas aplicações para download.
Retirado da Página de Extensões.
Conforme descrito no texto citado logo acima, uma extensão é um pequeno aplicativo que adiciona algo novo para uma ou mais aplicações da Mozilla. Este tutorial concentra-se em extensões para o Firefox, mas os mesmos princípios (ou muito semelhantes) aplicam-se a criação de extensões para outras aplicações, como Thunderbird, Seamonkey, e Flock.
Também é importante notar que existem diferenças entre a definição de extensão e add-on. Todas as extensões são add-ons, mas add-ons também podem ser temas, plugins, ou pacotes de idiomas. Este tutorial é sobre o desenvolvimento de extensão, mas os temas e pacotes de idiomas são desenvolvidos de uma forma muito semelhante. Plugins são totalmente diferentes, e não serão abordados aqui.
Você pode ler mais sobre plugins e seu desenvolvimento na Página de Plugins .
Firefox oferece uma arquitetura muito rica e flexível, que permite que os desenvolvedores de extensões possam adicionar recursos avançados, personalizar a experiência do usuário e substituir completamente ou remover partes do browser. O repositório de add-ons da Mozilla (AMO) possui uma extensa série de extensões com uma grande variedade de funções: a filtragem de conteúdo (AdBlock Plus, NoScript), a interação de aplicações web (Delicious Bookmarks, eBay Companion), desenvolvimento web ((DOM Inspector, Firebug) e proteção à criança (Glubble For Families). Estes são extensões complexas muito avançada e, e você vai aprender mais do que é preciso para criar extensões como estas (Glaxstar realmente trabalhou em três das listadas).
Extensões agora existem em três formas diferentes: SDK Add-ons (também conhecidos como Jetpacks), extensões bootstrapped e extensões tradicionais. Se você está apenas começando a desenvolver add-ons, o SDK Add-ons oferece uma ótima maneira de criar rapidamente as simples e construir sobre eles. Este tutorial concentra-se em extensões tradicionais, que são criados de forma diferente. Extensões de bootstrap são um passo acima dos tradicionais em termos de complexidade, de modo que você deve passar por este tutorial antes de dar-lhes uma tentativa.
Vamos começar o tutorial pela análise de uma extensão muito simples.
Extensão "Hello World"
Nossas extensões de amostra e este tutorial em geral são voltados para versões modernas do Firefox, mas a maioria funciona em versões mais antigas também.
Vamos agora começar com uma extensão "Hello World" básica. Vamos começar a instalar. Clique no link abaixo.
Isto poderá desencadear uma instalação ou um download de arquivo, dependendo do tipo de conteúdo que servidor web está usando para o arquivo. O tipo de conteúdo apropriado para acionar uma instalação é application/x-xpinstall. No caso desta wiki, o tipo de conteúdo não está configurado corretamente e um download de arquivo deve ocorrer.
e o tipo de conteúdo está configurado corretamente, provavelmente você vai ser notificado de que o site não é permitido instalar add-ons no Firefox. Esta é uma barreira de segurança que impede locais de instalação de extensões sem o consentimento do usuário. É necessário porque as extensões maliciosas podem fazer o mesmo nível de dano como qualquer programa malicioso: o roubo de dados, apagar ou substituir os arquivos, e fazendo com que o comportamento indesejado em geral. AMO é o único local pré-permitido porque todos os add-ons publicados na AMO passaram por um processo de revisão que inclui verificações de segurança.
Depois de baixar o arquivo, você pode arrastar e soltá-lo em área de conteúdo do Firefox, ea instalação deve começar.
Você verá uma janela dizendo que você está prestes a instalar uma extensão, com algumas informações adicionais, tais como o nome do autor. Você verá uma mensagem dizendo que o autor não pode ser verificado. Somente extensões assinados com um certificado digital pode verificar a autoria. Extensões assinadas são raras, mas vamos ver como a assiná-la mais tarde.
Clique no botão Instalar agora. Após a instalação da extensão, você será solicitado a reiniciar o Firefox. Instalar, desinstalar, ativar e desativar add-ons requerem uma reinicialização para completar, com a exceção de plugins NPAPI, extensões SDK Add-ons e extensões bootstrap. Este é um ponto importante para se ter em mente se você está construindo uma extensão que manipula outras extensões ou temas.
Depois de instalar, olhe para a janela principal do Firefox e veja se você notar algo diferente.
Você viu isso? Há um novo menu no menu principal, denominado "Hello World!". Se você abrir o menu e, em seguida, o item de menu abaixo, você verá uma mensagem de alerta. Clique no botão OK para fechá-la.
Isso é tudo que a extensão faz. Agora vamos dar uma olhada nisso.
Conteúdos da Extensão
Você deve ter notado que o arquivo de extensão que você instalou tem o nome xulschoolhello1.xpi. XPI (pronunciado "zippy") significa Cross-Platform Installer, porque o mesmo arquivo de instalação pode funcionar em todas as plataformas que o Firefox suporta. XPIs são simplesmente arquivos ZIP, mas Firefox reconhece a extensão XPI e desencadeia o processo de instalação quando um arquivo XPI é carregado.
Olhe para o arquivo XPI que você precisa baixá-lo em primeiro lugar, não instale ele. Se o servidor aciona uma instalação ao clicar em um link ou botão, o que você precisa fazer é clicar com o botão direito sobre o link de instalação e escolha a opção Salvar link como... .
unzip xulschoolhello1.xpi -d xulschoolhello1
No Windows, você pode alterar a extensão do arquivo de xpi para zip, ou abra o arquivo diretamente, descompactá-lo, usando uma ferramenta ZIP.
Você deverá ver a seguinte estrutura de diretórios:
- xulschoolhello1
- chrome.manifest
- install.rdf
- content
- browserOverlay.xul
- browserOverlay.js
- skin
- browserOverlay.css
- locale
- en-US
- browserOverlay.dtd
- browserOverlay.properties
- en-US
Isso é um monte de arquivos para algo tão simples! Na próxima seção, vamos examinar esses arquivos e ver o que eles fazem.
Este tutorial foi gentilmente doado à Mozilla pelo Appcoast.