Flutter: Supporter les "universal links" sur iOS

J'ai récemment intégré la fonctionnalité des liens profonds dans notre application TaleMe.

Les liens profonds sont des liens qui redirigent l'utilisateur vers une page spécifique de l'application, lorsque celle-ci est installée sur leur appareil.

Grâce à Flutter et sa doc, on voit rapidement comment les mettre en place. Cependant après plusieurs essais infructueux, des heures perdues un peu nulles, je vous proposes ici une check-list pour vous éviter de perdre du temps.

1/ Vérifier qu'on a bien ajouté les bonnes configurations dans le fichier ios/Runner/Info.plist

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
  ...
  <key>FlutterDeepLinkingEnabled</key>
  <true/>
  ...
</dict>
</plist>

2/ Vérifier qu'on a bien ajouté les bonnes configurations dans le fichier ios/Runner/Runner.entitlements

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
  <key>com.apple.developer.associated-domains</key>
  <array>
    <string>applinks:monsite.com</string>
  </array>
</dict>
</plist>

⚠ Ici, c'est bien le domaine monsite.com que l'on vise, pas ses sous-domaines. Si vous avez plusieurs domaines, vous pouvez les ajouter dans le tableau, ou utiliser un wildcard applinks:*.monsite.com.

3/ Ajouter le fichier apple-site-association

a) Respecter le format le plus récent ! Il se trouve qu'il existe plusieurs format de fichier apple-site-association, et on a vite fait de se mélanger les pinceaux. Je vous conseille de copier-coller depuis la doc d'Apple, et pas depuis stackoverflow ou autre.

b) Ajouter le fichier au bon endroit : il doit être accessible à cette adresse : https://monsite.com/.well-known/apple-app-site-association. Il semblerait qu'avant il était possible de le laisser à la racine du site, mais ce n'est plus fait mention dans la documentation d'Apple... prudence.

c) Le fichier doit être accessible en HTTPS, et ne pas être protégé par un mot de passe. Il doit également renvoyer le type-mime application/json. Pas de redirection non plus.

4/ Vérifier que le fichier apple-site-association est bien accessible et pris en compte par le CDN d'Apple

Habituellement, le CDN d'apple met à jour les informations entre 12h et 24h d'intervales (mais ça peut être plus long).

Vous pouvez utiliser les services suivants :

Il existe également quelques lignes de commandes pour vérifier que le fichier est bien accessible :

  sudo swcutil dl -d monsite.com

5/ Tester les liens profonds

Vous pouvez utiliser cette commande qui permet de vérifier que les liens profonds fonctionnent bien :

  swcutil verify -d monsite.com -j ./path/to/apple-app-site-association [-u <URL>]

Si vous voulez tester votre app vous pouvez utiliser un simulateur, puis ouvrez un terminal pour entrer cette commande :

  xcrun simctl openurl booted https://monsite.com/

l'option -u permet de spécifier l'URL à tester pour le "match", dans le cas où vous comptez filtrer les URL qui doivent être redirigées vers votre application.

Gardez en tête que le CDN d'Apple peut mettre du temps à mettre à jour les informations, et que les liens profonds ne fonctionneront pas si l'application n'est pas installée sur l'appareil.

Vous pouvez également cour-circuiter le CDN d'Apple, en modifiant le fichier ios/Runner/Runner.entitlements :

applinks:monsite.com -> applinks:monsite.com?mode=developer

Ca n'a pas fonctionné pour moi, mais ça peut être utile pour vous. Il faudra aussi retirer le mode développeur avant de publier l'application.

Et voilà ! J'espère que cet article vous aura été utile ! Pour Android, la démarche est assez différente, j'explorerai cela dans un autre article.

Tags

  • flutter
  • ios
  • mobile
  • universal links

Cet article à été posté le