Desmistificando Universal Links
No contexto mobile, deeplinks são links que unem os conteúdos de diferentes apps. Por exemplo, quando um usuário clica num link de um imóvel do VivaReal compartilhado por um amigo, o app nativo do VivaReal é aberto diretamente na página de detalhes do imóvel.
Além de oferecer uma experiência mais natural de navegação no sistema mobile, isto é, sem precisar abrir websites para ver o conteúdo, deeplinks também podem ser ótimas ferramentas de engajamento para o seu aplicativo. Através deles, usuários podem ir dos resultados de busca do Google direto para o aplicativo. Além disso, você pode utilizá-los em links de compartilhamento de conteúdo, trazendo mais instalações para o app.
Universal Links
Com o iOS 9, a Apple lançou uma nova forma de lidar com deeplinks chamada Universal Links. Eles vieram para substituir e resolver os problemas da antiga solução de URL Schemes, como por exemplo:
- Únicos: Universal Links são baseados em links HTTPS para o seu website. Logo, não há como outras apps definirem os mesmos links que os seus;
- Flexíveis: Universal Links funcionam mesmo se o app não estiver instalado, abrindo o link no Safari neste caso;
- Privacidade: Outras apps conseguem se comunicar com a sua app sem saber se ela está instalada ou não.
Com esse lançamento, vieram também várias dúvidas sobre o funcionamento e implementação. O objetivo desse artigo é passar pelas principais etapas da implementação de Universal Links no app do VivaReal, mostrando como fizemos para resolver alguns problemas que apareceram no meio do caminho. ✌️
Implementando Universal Links
São necessárias 2 etapas para integrar seu app com Universal Links.
- Criar o arquivo apple-app-site-association (Association File) e fazer upload dele no seu site HTTPS;
- Tratar o comportamento dos deeplinks no aplicativo.
Criando o Association File
O Association File é um arquivo JSON no qual você identifica os links do seu site que serão suportados pelo Universal Links. Ele possui uma sintaxe simples que possibilita criar "expressões regulares" para definir os caminhos do site que devem ser tratados no app.
Na linha 2, definimos o objeto de Universal Links do arquivo. Na linha 6, o campo appID é formado pelo team ID (123ABC) seguido pelo bundle ID (com.VivaReal.VivaRealApp).
A linha 7 é a parte mais importante, onde definimos o vetor paths. Nele colocamos os caminhos dos links, isto é, as sessões do site que devem ser tratadas no app. No aplicativo do VivaReal, apenas os links de busca (/venda, /aluguel e /imoveis-lancamento) e de páginas de detalhes de imóveis (/imovel) são tratados.
Apenas as quatro primeiras entradas bastariam, mas também colocamos regras explícitas para os caminhos que não devem ser tratados, ou seja, que devem ser abertos diretamente no Safari. Essas regras são identificadas pela palavra NOT antes dos caminhos.
Além dessas, há outras formas de expressar os caminhos:
- '*' para tratar todos os caminhos do site ou seções inteiras (/posts/*, por exemplo);
- '?' para corresponder a um caracter. Assim, é possível criar caminhos no estilo /posts/201?/, por exemplo.
Após criar o Association File, é necessário colocá-lo na raiz do seu site ou dentro do subdiretório .well-known. Importante: Não coloque .json no nome do arquivo!
O Association File é baixado para o device do usuário quando ele instala ou atualiza o aplicativo.
Web Credentials e Handoff
Apesar de não ser o foco do artigo, é importante dar atenção para duas outras partes do arquivo: os campos webcredentials e activitycontinuation.
Com o campo webcredentials, é possível compartilhar as credenciais de login do website com o seu app. Assim, se o usuário já fez login no seu site no Safari, você pode ter acesso a essas credenciais e fazer login automaticamente quando ele entrar no aplicativo. Mais informações sobre Shared Web Credentials.
O campo activitycontinuation é essencial para implementar o Handoff entre o site e o aplicativo. Por exemplo, se o usuário estiver visitando um produto do seu site no Safari do Mac, ele tem a opção de abrir o app do iPhone diretamente no produto, a partir da tela bloqueada. Mais informações sobre Handoff.
Integrando Universal Links no aplicativo
Uma vez que o Association File é criado e colocado no site, é necessário configurar o projeto no Xcode com os domínios suportados pelo Universal Links e implementar o tratamento para quando o app for aberto através de um dos links.
Definindo os domínios suportados
Na aba Capabilities do target do seu projeto, procure a seção Associated Domains e adicione uma entrada para o site, no formato applinks:www.example.com.
É possível também adicionar todos os subdomínios do site utilizando o formato applinks:*.example.com.
Implementando o tratamento para os links
Quando um app é aberto através de um Universal Link, o método continueUserActivity do AppDelegate é chamado.
Como parâmetro desse método, é passado um objeto do tipo NSUserActivity que contém as informações do link, como podemos ver no código abaixo.
Na linha 4, obtemos a url que foi clicada pelo usuário. Nesse caso, temos como exemplo uma url de busca por casas para aluguel no bairro Consolação. Na linha 5, separamos a url em componentes. Por fim, nas linhas 14 e 15 obtemos algumas informações necessárias para tratarmos esse link no app, o tipo do negócio (venda, aluguel ou lançamento) e o tipo do imóvel (casa residencial).
Uma vez que temos esses dados, precisamos apenas implementar a interface para tratar cada tipo de link. 🎉
Testando os Universal Links
Após fazer upload do Association File e implementar o tratamento dos Universal Links no app, chegou a hora de testar.
Eu sugiro você utilizar o app de Notas, criando uma nota com um Universal Link. Para checar se tudo está funcionando como esperado, basta fazer um long press no link e ver que existe a opção de abrir o link com o seu app, como na imagem abaixo.
A forma como o iOS lida com Universal Links no Safari não é muito intuitiva, o que pode gerar confusões nos testes iniciais.
O sistema vai sempre analisar o contexto do usuário quando precisa decidir onde abrirá o link. Caso o usuário já esteja navegando dentro do site no Safari e clica em um Universal Link, o seu contexto será mantido e a nova página abrirá no Safari.
Caso o link seja aberto no app e o usuário clica no botão superior direito, para acessar a página no Safari, os próximos links serão abertos diretamente no navegador, mesmos se acessados de outros aplicativos.
Universal Links Drops
- O Association File é atualizado no device do usuário sempre que ele instala ou atualiza o aplicativo. Não espere que os Universal Links funcionem logo após atualizar o arquivo no site. Se verificar um comportamento estranho, tente reinstalar o aplicativo;
- Se o seu aplicativo deve suportar Handoff e Shared Web Credentials no iOS 8, é necessário assinar o Associated File utilizando um certificado TLS. Mais informações aqui;
- Alguns serviços ajudam você a implementar Universal Links e também oferecem outras funcionalidades interessantes, como o Branch;
- Há algumas ferramentas online para testar se o Association File do seu site é válido, como essa aqui.
