Antes de começar a criar protótipos e testar seu aplicativo da Web com o emulador do Firebase Hosting, entenda o fluxo de trabalho geral do Firebase Local Emulator Suite e instale e configure o Local Emulator Suite e revise seus comandos CLI .
Você também deve estar familiarizado com os recursos e o fluxo de trabalho de implementação do Firebase Hosting. Comece com a introdução ao Firebase Hosting .
O que posso fazer com o emulador do Firebase Hosting?
O emulador do Firebase Hosting fornece emulação local de serviços de hospedagem de alta fidelidade, fornecendo grande parte da funcionalidade encontrada na hospedagem de produção . O emulador de hospedagem permite:
- Crie protótipos de seus sites estáticos e aplicativos da web sem incorrer em custos de armazenamento ou acesso
- Protótipo, teste e depure funções HTTPS antes de implantar em seu site de hospedagem
- Teste sites e aplicativos da web em fluxos de trabalho de integração contínua e em contêineres.
Escolha um projeto do Firebase
O Firebase Local Emulator Suite emula produtos para um único projeto do Firebase.
Para selecionar o projeto a ser usado, antes de iniciar os emuladores, na CLI, execute firebase use em seu diretório de trabalho. Ou você pode passar o sinalizador --project para cada comando do emulador.
O Local Emulator Suite oferece suporte à emulação de projetos reais do Firebase e projetos de demonstração .
| Tipo de projeto | Características | Use com emuladores |
|---|---|---|
| Real | Um projeto real do Firebase é aquele que você criou e configurou (provavelmente por meio do console do Firebase). Projetos reais têm recursos ativos, como instâncias de banco de dados, intervalos de armazenamento, funções ou qualquer outro recurso configurado para esse projeto do Firebase. | Ao trabalhar com projetos reais do Firebase, você pode executar emuladores para qualquer um ou todos os produtos compatíveis. Para quaisquer produtos que você não esteja emulando, seus aplicativos e código interagirão com o recurso ativo (instância de banco de dados, depósito de armazenamento, função, etc.). |
| Demonstração | Um projeto de demonstração do Firebase não tem configuração real do Firebase nem recursos ativos. Esses projetos geralmente são acessados por meio de codelabs ou outros tutoriais. Os IDs de projeto para projetos de demonstração têm o prefixo | Ao trabalhar com projetos de demonstração do Firebase, seus aplicativos e códigos interagem apenas com emuladores . Se o seu aplicativo tentar interagir com um recurso para o qual um emulador não está em execução, esse código falhará. |
Recomendamos que você use projetos de demonstração sempre que possível. Os benefícios incluem:
- Configuração mais fácil, pois você pode executar os emuladores sem nunca criar um projeto Firebase
- Maior segurança, pois se o seu código invocar acidentalmente recursos não emulados (de produção), não há chance de alteração de dados, utilização e cobrança
- Melhor suporte offline, já que não há necessidade de acesso à internet para baixar a configuração do seu SDK.
Fluxo de trabalho principal de prototipagem
Se você estiver fazendo iterações rápidas ou quiser que seu aplicativo interaja com recursos de projeto de back-end emulados, você pode testar seu conteúdo e configuração do Hosting localmente. Ao testar localmente, o Firebase veicula seu aplicativo Web em um URL hospedado localmente.
(Opcional) Por padrão, seu aplicativo hospedado localmente interagirá com recursos reais do projeto, não emulados (funções, banco de dados, regras etc.). Em vez disso, você pode conectar opcionalmente seu aplicativo para usar quaisquer recursos de projeto emulados que você configurou. Saiba mais: Banco de dados em tempo real | Nuvem Firestore | Funções de nuvem
Na raiz do diretório local do projeto, execute o seguinte comando:
firebase emulators:start
Abra seu aplicativo Web na URL local retornada pela CLI (geralmente
http://localhost:5000).Para atualizar o URL local com alterações, atualize seu navegador.
Teste de outros dispositivos locais
Por padrão, os emuladores respondem apenas às solicitações de localhost . Isso significa que você poderá acessar o conteúdo hospedado a partir do navegador do seu computador, mas não de outros dispositivos na sua rede. Se quiser testar em outros dispositivos locais, configure seu firebase.json assim:
"emulators": {
// ...
"hosting": {
"port": 5000
"host": "0.0.0.0"
}
}
Gere tokens de autenticação para fluxos de trabalho de integração contínua
Se seus fluxos de trabalho de integração contínua dependem do Firebase Hosting, você precisará fazer login usando um token para executar firebase emulators:exec . Os demais emuladores não requerem login.
Para gerar um token, execute firebase login:ci em seu ambiente local; isso não deve ser realizado a partir de um sistema CI. Siga as instruções para autenticar. Você só precisará executar esta etapa uma vez por projeto, pois o token será válido em todos os builds. O token deve ser tratado como uma senha; certifique-se de que seja mantido em segredo.
Se o seu ambiente de CI permitir que você especifique variáveis de ambiente que podem ser usadas nos scripts de construção, basta criar uma variável de ambiente chamada FIREBASE_TOKEN , com o valor sendo a string do token de acesso. A CLI do Firebase selecionará automaticamente a variável de ambiente FIREBASE_TOKEN e os emuladores serão iniciados corretamente.
Como último recurso, você pode simplesmente incluir o token em seu script de construção, mas certifique-se de que partes não confiáveis não tenham acesso. Para esta abordagem codificada, você pode adicionar --token "YOUR_TOKEN_STRING_HERE" ao comando firebase emulators:exec .
Qual o proximo?
- Execute um guia de início rápido usando o emulador do Hosting seguindo o codelab da Web do Firebase .
- Entenda como criar protótipos de funções HTTPS usando o emulador do Hosting, conforme descrito nos guias do Hosting para funções .
- Para ver um conjunto selecionado de vídeos e exemplos detalhados de instruções, siga a lista de reprodução de treinamento do Firebase Emulators .