As atividades confiáveis da Web podem ser um pouco complicadas de configurar, especialmente se você só quer mostrar seu site. Este guia vai mostrar como criar um projeto básico que usa atividades confiáveis na Web, cobrindo todos os detalhes.
Ao final deste guia, você vai:
- Usaram o Bubblewrap para criar um aplicativo que usa uma Atividade confiável na Web e passa na verificação.
- Entenda quando suas chaves de assinatura são usadas.
- Determinar a assinatura usada para criar o aplicativo Android.
- Saiba como criar um arquivo básico de Digital Asset Links.
Para seguir este guia, você vai precisar de:
- Node.js 10 ou mais recente instalado no computador de desenvolvimento
- Um smartphone ou emulador Android conectado e configurado para desenvolvimento. Se você estiver usando um smartphone físico, ative a depuração USB.
- Um navegador compatível com a Atividade Confiável na Web no seu smartphone de desenvolvimento
- Um site que você quer acessar na Atividade Confiável na Web
Uma Atividade confiável da Web permite que seu app Android abra uma guia do navegador em tela cheia sem nenhuma interface do navegador. Esse recurso é restrito a sites de sua propriedade, e você prova isso configurando os Digital Asset Links. Falaremos mais sobre eles depois.
Quando você inicia uma atividade da Web confiável, o navegador verifica se os links de recursos digitais estão corretos. Isso é chamado de verificação. Se a verificação falhar, o navegador vai voltar a mostrar seu site como uma guia personalizada.
Instalar e configurar o Bubblewrap
O Bubblewrap é um conjunto de bibliotecas e uma ferramenta de linha de comando (CLI) para Node.js que ajuda os desenvolvedores a gerar, criar e executar apps da Web progressiva em apps Android usando a Atividade da Web confiável.
A CLI pode ser instalada com o seguinte comando:
Como configurar o ambiente
Ao executar o Bubblewrap pela primeira vez, ele oferece a opção de fazer o download e a instalação automática das dependências externas necessárias. Recomendamos que você deixe a ferramenta fazer isso, porque ela garante que as dependências sejam configuradas corretamente. Consulte a documentação do Bubblewrap para usar uma instalação de ferramentas de linha de comando do Java Development Kit (JDK) ou do Android.
Inicializar e criar o projeto
Para inicializar um projeto Android que encapsula um PWA, execute o comando init:
O Bubblewrap vai ler o manifesto da Web, pedir que os desenvolvedores confirmem os valores a serem usados no projeto Android e gerar o projeto usando esses valores. Depois que o projeto for gerado, gere um APK executando:
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 teste ou enviado à 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 conectado ao computador, execute:
Como alternativa, é possível usar a ferramenta adb.
Observação: a ferramenta de linha de comando **adb** está localizada nas ferramentas de linha de comando do Android em **android_sdk/platform-tools/**.
O aplicativo agora está disponível no inicializador do dispositivo. Ao abrir o aplicativo, você vai notar que o site é aberto como uma guia personalizada, não como uma Atividade da Web confiável. Isso acontece porque ainda não configuramos a validação de links de recursos digitais. Mas primeiro...
Alternativas para a interface gráfica do usuário (GUI) no formato de balão
O PWA Builder fornece uma interface gráfica que usa a biblioteca Bubblewrap para gerar projetos de atividades confiáveis na Web. Confira mais instruções sobre como usar o PWA Builder para criar um app Android que abra seu PWA neste post 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 falha na verificação é o uso da 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 cria o aplicativo, um APK é 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 chaves de assinatura e como elas se relacionam ao Bubblewrap e ao Google Play.
Como configurar o arquivo do link de recurso
Os Links de recursos digitais consistem basicamente em um arquivo no seu site que aponta para o app e alguns metadados no app que apontam para o site.
Depois de criar o arquivo assetlinks.json, faça o upload dele no seu site em .well-known/assetlinks.json em relação à raiz) para que o app possa ser verificado corretamente pelo navegador. Confira um estudo detalhado sobre os links de recursos digitais para mais informações sobre como eles se relacionam à sua chave de assinatura.
Como verificar o navegador
Uma atividade confiável na Web tenta aderir à escolha padrão de navegador do usuário. Se o navegador padrão do usuário for compatível com as Atividades confiáveis na Web, ele será iniciado. Caso contrário, se algum navegador instalado oferecer suporte a Atividades confiáveis na Web, ele será escolhido. Por fim, o comportamento padrão é retornar ao modo das guias personalizadas.
Isso significa que, se você estiver destravando algo relacionado às Atividades Confiáveis na Web, verifique se está usando o navegador que pensa estar usando. Use o comando a seguir para verificar qual navegador está sendo usado:
A seguir
Se você seguiu este guia, sua Atividade da Web confiável vai funcionar e você terá conhecimento suficiente para depurar o que está acontecendo quando a verificação falhar. Caso contrário, confira mais conceitos do Android para desenvolvedores da Web ou registre um problema do GitHub em relação a estas documentações.
Para as próximas etapas, recomendo que você comece criando um ícone para o app. Depois disso, você pode implantar o app na Play Store.