Pode ser um pouco difícil configurar Atividades Confiáveis na Web, especialmente se você só quiser exibir seu site. Este guia mostra como criar um projeto básico que usa Atividades Confiáveis na Web, para abordar todos os pegadinhas.
Ao final deste guia, você poderá:
- Já usou o Bubblewrap para criar um aplicativo. que use uma Atividade Confiável na Web e passe na verificação.
- Saiba quando suas chaves de assinatura são usadas.
- Seja capaz de determinar a assinatura com a qual seu aplicativo Android está sendo criado.
- Saber como criar um arquivo básico de Digital Asset Links.
Confira o que é necessário para seguir este guia:
- Node.js 10 ou versão mais recente instalado no computador de desenvolvimento.
- Um emulador ou smartphone Android conectado e configurado para desenvolvimento (Ative a depuração USB se você está usando um telefone físico).
- Um navegador compatível com a Atividade Confiável na Web no seu smartphone de desenvolvimento O Chrome 72 ou posterior funcionará. A compatibilidade com outros navegadores está em breve.
- Um site que você quer visualizar na Atividade na Web Confiável.
Uma Atividade na Web confiável permite que o app Android abra uma guia do navegador em tela cheia sem qualquer interface de usuário do navegador. Esse recurso é restrito a sites de sua propriedade, e você prova isso configurando os links de ativos digitais. Falaremos mais sobre eles depois.
Quando você iniciar uma Atividade na Web Confiável, o navegador verificará se o Digital Asset Links isso se chama verificação. Se a verificação falhar, o navegador voltará a exibir seu site como um Guia Personalizada.
Instalar e configurar o Bubblewrap
O Bubblewrap é um conjunto de bibliotecas e um comando. de linha de comando (CLI, na sigla em inglês) para Node.js que ajuda os desenvolvedores a gerar, criar e executar Progressive Web Apps em apps Android usando a Atividade Confiável na Web.
A CLI pode ser instalada com o seguinte comando:
npm i -g @bubblewrap/cli
Como configurar o ambiente
Ao executar o Bubblewrap pela primeira vez, ele oferece o download e a instalação automáticos do as dependências externas necessárias. Recomendamos permitir que a ferramenta faça isso, porque isso garante que se as dependências estão configuradas corretamente. Consulte a documentação sobre bolhas para usar um instalação de ferramentas de linha de comando do Android ou do Java Development Kit (JDK) existente.
Inicializar e criar o projeto
Para inicializar um projeto Android que encapsula um PWA, execute o comando init:
bubblewrap init --manifest=https://my-twa.com/manifest.json
O balão inserirá o texto Manifesto da Web, peça aos desenvolvedores que confirmem os valores a serem usados no projeto Android e gere o projeto usando esses valores. Depois que o projeto for gerado, gere um APK executando o seguinte:
bubblewrap build
Executar
A etapa de build vai gerar um arquivo chamado app-release-signed.apk. Esse arquivo pode ser instalado em um
dispositivo de desenvolvimento para testes ou enviado para a Play Store para lançamento.
O balão fornece um comando para instalar e testar o aplicativo em um dispositivo local. Com o dispositivo de desenvolvimento de software conectado ao computador execute:
bubblewrap install
Como alternativa, a ferramenta adb pode ser usados.
adb install app-release-signed.apk
O aplicativo deve estar disponível no inicializador do dispositivo. Ao abrir o aplicativo, perceber que seu site foi lançado como uma Guia Personalizada, e não como uma Atividade Confiável na Web, porque ainda não configuramos a validação dos Links de recursos digitais, mas antes...
Alternativas para a interface gráfica do usuário (GUI) no formato de balão
O PWA Builder fornece uma interface de GUI que usa o recurso de balão para potencializar a geração de projetos de Atividade Confiável na Web. Encontre mais instruções sobre como usar o PWA Builder para criar um app Android que abre seu PWA em esta postagem do blog.
Observação sobre chaves de assinatura
Os Links de recursos digitais consideram a chave com que um APK foi assinado, e uma causa comum de falhas na verificação é usar a assinatura errada. Lembre-se de que a falha na verificação significa que o site será aberto como uma guia personalizada com a interface do navegador na parte superior da página. Quando o Bubblewrap criar o aplicativo, um APK será criado com uma configuração de chave durante a etapa init. No entanto, ao publicar o app no Google Play, outra chave pode ser criada para você, dependendo de como você quer lidar com as chaves de assinatura. Saiba mais sobre as chaves de assinatura e a relação delas com o Bubblewrap e o Google Play.
Como configurar o arquivo do link de recurso
Os Digital Asset Links consistem essencialmente em um arquivo no site que aponta para seu app e alguns metadados no app que direcionam para seu site.
Depois de criar o arquivo assetlinks.json, faça upload dele para seu site em .well-known/assetlinks.json em relação à raiz) para que o app possa ser verificado corretamente pelo navegador. Confira uma análise detalhada dos Links de recursos digitais (link em inglês) para mais informações sobre como isso está relacionado à sua chave de assinatura.
Verificando o navegador
Uma Atividade na Web Confiável tentará aderir à escolha de navegador padrão do usuário. Se o navegador padrão do usuário oferecer suporte a Atividades Confiáveis na Web, elas serão iniciadas. Caso algum navegador instalado seja compatível com Atividades Confiáveis na Web, ele será escolhido. Finalmente, o comportamento padrão é voltar para o modo de guias personalizadas.
Isso significa que, se você estiver depurando algo relacionado a atividades confiáveis na Web, você deverá use o navegador que você imagina. Você pode usar o seguinte comando para verificar qual navegador está sendo usado:
> adb logcat -v brief | grep -e TWAProviderPicker
D/TWAProviderPicker(17168): Found TWA provider, finishing search: com.google.android.apps.chrome
Próximas etapas
Espero que, se você seguiu este guia, você terá uma Atividade na Web Confiável em funcionamento e terá conhecimento para depurar o que acontece quando a verificação falha. Caso contrário, consulte mais conceitos do Android para desenvolvedores Web ou registre um problema no GitHub nestes documentos.
Para as próximas etapas, recomendo que você comece como criar um ícone para seu app. Depois de fazer isso, você já pode implantar seu app na Play Store.