前回のiOS版(*´ω｀*)

FlutterでDeepLinkに対応する(Android/App Links) - くらげになりたい。

Webサイトの特定のURLにアクセスするとアプリが開く、
Deep Linkに対応したいなと思い、
いろいろ調べてみたときの備忘録(*´ω｀*)

Flutterの公式ドキュメントはこのあたり

routing packageに、go_routerを利用しているので、
そのあたりも含めて(*´ω｀*)

go_router | Flutter package

Info.plistの変更

Xcodeを開いて、Info.plistに項目を追加する

Key: FlutterDeepLinkingEnabled
Type: Boolean
Value: YES

Associated Domainsの追加

XcodeのRunnerにある「Signing & Capabilities」タブから

タブの左側にある「＋Capability」をクリックし、
「Associated Domains」を追加する

「＋」からapplinks:<web domain>の形式でドメインを追加

apple-app-site-associationの配置

以下の形式のファイルをWebサイトに配置する

<webdomain>/.well-known/apple-app-site-association

{
  "applinks": {
    "details": [
      {
        "appIDs": ["S8QB4VV633.com.example.deeplinkCookbook"],
        "paths": ["*"]
      }
    ]
  }
}

appIDは、<team id>.<bundle id>の形式
pathsは、リダイレクトするパス(この例ではすべて)
その他の設定は、Appleの公式ドキュメントを確認する

反映には最大24時間かかる

AppleのCDNに反映されるまで、最大24時間かかるらしい。。
以下のURLで反映状況を確認できる。

https://app-site-association.cdn-apple.com/a/v1/<web domain>

とりあえず、動作確認したい場合は、開発者モードを有効にすればOK

Associated Domainsに?mode=developerをつける
- applinks:<web domain>?mode=developer
端末の「設定＞デベロッパ＞関連ドメインの開発」をONにする

go_routerの設定

Androidとは違い、特に設定は不要。
起動中でも起動前でも、pathがわたってくる

Tips

特定のパスを指定する

apple-app-site-associationのpathsに指定すればOK
ただ正規表現の曲があり、?は任意の一文字らしい。NOTも使える

{
  "applinks": {
    "details": [
      {
        "appIDs": ["S8QB4VV633.com.example.deeplinkCookbook"],
         "paths": [
          "/stages/*",
          "/*/stages/*",
          "NOT /aaa/*"
        ]
      }
    ]
  }
}

pathsの代わりに、componentsで絞り込むことも可能

{
  "applinks": {
    "details": [
       {
         "appIDs": [ "ABCDE12345.com.example.app", "ABCDE12345.com.example.app2" ],
         "components": [
           {
              "#": "no_universal_links",
              "exclude": true,
           },
           {
              "/": "/buy/*",
           },
           {
              "/": "/help/website/*",
              "exclude": true,
           },
           {
              "/": "/help/*",
              "?": { "articleNumber": "????" },
           }
         ]
       }
     ]
   }
}

わかりにくいけど、キーの意味は以下の通り

/ ... 対象のパス
# ... urlのフラグメント
? ... クエリパラメタ
comment ... コメント
exclude ... 対象外にする

起動前での動作確認

flutter runでインストールすると、起動前の確認ができない。。
なので、自前でビルド＆インストールする必要がある。

$ flutter build ios
$ flutter install

実機のログは、以下で確認できる

Xcodeを開く
メニューの「Window＞Devices And Simulators」を開く
対象の端末から「Open Console」を開く

以上!! これでiOSでもいい感じに(*´ω｀*)

くらげになりたい。

くらげのようにふわふわ生きたい日曜プログラマなブログ。趣味の備忘録です。

FlutterでDeepLinkに対応する(iOS/Universal Links)