LoginSignup
88
58

More than 5 years have passed since last update.

apple-app-site-associationのpaths(遷移対象パス)の作り方(UniversalLinks対応)

Last updated at Posted at 2017-06-28

概要

iOS9からはじまったUniversal Links(Deep Link)
詳しい導入方法はこちらの記事などで載っています。

URLスキーム・独自ディープリンク実装に代わる、Universal Links(iOS 9で導入)でより良いUXを実現
http://qiita.com/mono0926/items/2bf651246714f20df626

Universal Links日本語ガイドhttps://developer.apple.com/jp/documentation/General/Conceptual/AppSearch/UniversalLinks.html

  • 実際に導入した際に、細かいパスの設定でどこまでできるのか迷った(正規表現があまり使えない)ので、
  • 具体的なapple-app-site-associationファイル(Jsonファイルみたいなやつ)のpaths設定事例をまとめておきます。
  • ※新しいパスを追加するときに気になったのでパスの設定方法に特化して書いています。
  • (UniversalLinksの導入を1からしたい場合は、全体の流れが書かれている引用の記事をご覧ください)

※前提知識

apple-app-site-associationファイルって?

以下のような形式のファイル

{
    "applinks": {
        "App": [], 
        "details": [
            {
                "appID": "KEROKERO1234.com.apple.app1", ←TeamIDとBundleIdentifierを組み合わせたもの
                "paths": [
                    "/aaaa.html" ←アプリに遷移させたいパス
                ]
            }
        ]
    }
}

→アプリのインストール時に、
Associated Domainsで指定されたドメインのサイトに取得しに行きます。
(例:https://XXXX.co.jp/apple-app-site-association

→こちらのファイルのpathsに記載されたパスのみ、
→SafariなどからURLがタップされた際にアプリに遷移するようになります。
(遷移させたいパスのみ記載してください)

pathsに使えるメタ文字

?* です。

 メタ文字   解説 
? 任意の1文字
* 0か任意の1文字以上

+αで、NOTで否定も使えます。(NOTはiOS9.2以上から使える)

:turtle:!!!(少ない)
→細かくわけたいときは、工夫が必要です。

豆知識

1

遷移元パスが
https://hogehoge.co.jp/search?id=kerokero
https://hogehoge.co.jp/search#id=kerokero

?# 以降のパラメータは無視される。
→例の場合、?以降のidで遷移判定はできない。

2

設定パスが複数ある場合、
     "paths": [
          "/AAAA/BBBB",
          "/AAAA/CCCC",
     ]

→上から優先度が高く実行される。条件が被るようなら前に書くようにする。

paths(遷移させたい対象パス)設定方法

:white_check_mark: 例1:自サイトの全てのパスをアプリに遷移させたい

:boy_tone1:「問答無用に、自サイトへのWebアクセスをすべてアプリに飛ばしたい!!」

答え
{
    "applinks": {
        "App": [], 
        "details": [
            {
                "appID": "KEROKERO1234.com.apple.app1", 
                "paths": [
                    "*"
                ]
            }
        ]
    }
}

https://hogehoge.co.jp/ 配下にあるすべてのページが遷移します。
( 設定は、/* とかでもいい)
(数が少ないようでしたら丁寧に1つ1つのパスを全て記載してもいいです)

:white_check_mark: 例2:aaaaとbbbbいうページがあるけど、aaaaだけ遷移したい

:boy_tone1:「このページだけを遷移させたい!!」

https://hogehoge.co.jp/aaaa.html
https://hogehoge.co.jp/bbbb.html の2種類のページあるとき、

特定のページだけ遷移したい。→直接そのパスを書きましょう
答え
{
    "applinks": {
        "App": [], 
        "details": [
            {
                "appID": "KEROKERO1234.com.apple.app1", 
                "paths": [
                    "/aaaa.html"
                ]
            }
        ]
    }
}

https://hogehoge.co.jp/aaaa.html のみ遷移します。

:white_check_mark: 例3:TOP画面のみ遷移させたい

:boy_tone1:「細かいページはまだ対応できてないのでTOP画面だけ遷移させたい。」

https://hogehoge.co.jp/
https://hogehoge.co.jp/aaaa.html
https://hogehoge.co.jp/bbbb.html などのページがあるとき、
TOP画面のhttps://hogehoge.co.jp/のみを遷移させたい。→TOP画面 "/"のみを書きましょう。
答え
{
    "applinks": {
        "App": [], 
        "details": [
            {
                "appID": "KEROKERO1234.com.apple.app1", 
                "paths": [
                    "/"
                ]
            }
        ]
    }
}

https://hogehoge.co.jp/ のみ遷移します。

:white_check_mark: 例4:特定の年代の一部ページだけ遷移させたい

:boy_tone1:「同じ形式の連番のページなんだけど特定の年代のページ遷移させたいなぁ」

https://hogehoge.co.jp/
https://hogehoge.co.jp/2020/ranking/
https://hogehoge.co.jp/2020/news/
https://hogehoge.co.jp/2019/ranking/
https://hogehoge.co.jp/2019/news/
https://hogehoge.co.jp/2018/ranking/
https://hogehoge.co.jp/2018/news/ などのページがあるとき、

201X年の記事だけ遷移させたい。→?を使って正規表現で対応しましょう。
答え
{
    "applinks": {
        "App": [], 
        "details": [
            {
                "appID": "KEROKERO1234.com.apple.app1", 
                "paths": [
                    "/201?/*"
                ]
            }
        ]
    }
}

https://hogehoge.co.jp/201X/ranking
https://hogehoge.co.jp/201X/news/ のみ遷移します。

:white_check_mark: 例5:特定のページのを遷移させないようにしたい

:boy_tone1:「このページはアプリに飛ばすとやばいから遷移させたくないなぁ」

https://hogehoge.co.jp/
https://hogehoge.co.jp/ranking/
https://hogehoge.co.jp/news/
https://hogehoge.co.jp/book/
https://hogehoge.co.jp/movie/ などのページがあるとき、

/movie を遷移させたくない。→NOT対応しましょう
答え
{
    "applinks": {
        "App": [], 
        "details": [
            {
                "appID": "KEROKERO1234.com.apple.app1", 
                "paths": [
                    "NOT /movie/"
                    "*"
                ]
            }
        ]
    }
}

https://hogehoge.co.jp/movie/ 以外のすべてのページが遷移します。
※NOTは先に書く必要があります。(上に書いてある条件が優先)

以下の順番だと、NOT条件は効きません。(現状)

"*"
"NOT /movie/"

→この場合、全てのパスを遷移させるという条件が勝ってしまいます。

:white_check_mark: 例6:複数のアプリに対応させたい

:boy_tone1:「Webサイトは1つだけど、アプリは2個に分けてるけど、両方のアプリに飛ばしたいなぁ」

detailsに両方のアプリの設定を追加し
それぞれ対応させたいパスを配列で繋げてあげればいいだけ
答え
{
    "applinks": {
        "App": [], 
        "details": [
            {
                "appID": "KEROKERO1234.com.apple.app1", 
                "paths": [
                    "/aaaa/bbbb/", 
                    "/aaaa/bbbb/2015/*"
                ]
            }, 
            {
                "appID": "KEROKERO5678.com.apple.app2", 
                "paths": [
                    "*"
                ]
            }
        ]
    }
}

→app1は"/aaaa/bbbb/", "/aaaa/bbbb/2015/*"の2パターンで遷移,
→app2は全てのページが遷移します。

:white_check_mark: その他:いろいろ検証

Q. :boy:「パスの最後のスラッシュありなしってどんな感じになるの?」

以下の2つはどういう扱いになるか?

https://hogehoge.co.jp/ranking
https://hogehoge.co.jp/ranking/

→Jsonファイルのほうで、"/ranking/" とすると、両方引っかかる。
→末尾の/はあってもなくても関係ない

Q.:boy:「クエリついてるやつってどうなるの?」

https://hogehoge.co.jp/ranking/
https://hogehoge.co.jp/ranking/?id=kerokero

→Jsonファイルのほうで、"/ranking/" とすると、両方引っかかる。
→クエリがついていてもなくても関係ない

:white_check_mark: 最近ちょっと迷ったこと(余談)

以下のようなパスがあるとする
1. https://hogehoge.co.jp/ranking/XXX/
2. https://hogehoge.co.jp/ranking/XXX/XXX/
3. https://hogehoge.co.jp/ranking/XXX/XXX/XXX/
4. https://hogehoge.co.jp/ranking?id=kerokero&word=kerokero

1~3は、遷移させたいけど、ranking?のやつは遷移させたくない場合。
◯1. https://hogehoge.co.jp/ranking/XXX/
◯2. https://hogehoge.co.jp/ranking/XXX/XXX/
◯3. https://hogehoge.co.jp/ranking/XXX/XXX/XXX/
×4. https://hogehoge.co.jp/ranking?id=kerokero&word=kerokero

:point_up:パターン1

pathsの設定を、
"/ranking/*"

とする。

→前項目で記述した通り/ranking?も引っかかってしまうのでダメです。

:point_up:パターン2

"NOT /ranking",
"/ranking/*"

とする。

→これだと、/ranking?は引っかからない
/ranking/XXX/とかはOK

:point_up:パターン3

"/ranking/*/"

とする。

→これだと,結局パターン2と同じ意味
/ranking?は引っかからない
/ranking/XXX/とかはOK

:writing_hand::結論

パターン2でも3でもいいけど、
/ranking?は拾ってないよってパッっとわかるようにパターン2でもいいかなぁ..

→状況に応じて使いやすいほう、わかりやすいほうにしていきましょう。

おまけ:大手サイトのファイルを覗いてみよう

終わり

:bow: 以上、ありがとうございました。:bow:

88
58
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
88
58