😥
SafariでGoogle Playストアのリンクが非表示になる挙動について調査した
経緯
業務でアプリのダウンロードリンクの実装をしていた時に遭遇した謎事象について調査したので、そのまとめです。
業務中はiOS14系の端末を利用しており、そちらではGoogle Playストアのリンクが問題なく表示できていたことから、おそらくiOS 16(Safari 16)から追加された仕様なんだと思います。
どこかで公式に言及済みであれば、教えていただけると幸いです。
前提共有
デモサイトで再現させた時の画像
調査に用いたアプリストアのリンクは下記の通り
-
https://apps.apple.com/jp/app/%E3%83%9E%E3%83%83%E3%83%97/id915056765
- Apple Map
-
https://play.google.com/store/apps/details?id=com.google.android.apps.maps&hl=ja&gl=US
- Google Map
動作確認・ソースコード
確認環境
- Node.js LTS
- Vite 4.0.0(Vanilla JS)
- ホスティング先はVercel
調査観点
観点 | 判断方法 | 期待値 |
---|---|---|
aタグの子要素が非表示の原因 | テキスト/画像のリンクで比較 | 子要素に関係なく消えること |
ホスト名が非表示の原因 |
play , docs , drive .google.comで比較 |
play.google.comのみ非表示になること |
pathnameで判定しているか |
/store/apps/details を分割して結果比較 |
フルパス(/store/apps/details )の時に非表示になること |
特定のクエリパラメータで判定しているか |
id , hl , gl , hoge を指定して比較 |
id を指定した時に非表示になること |
各項目の調査結果
aタグの子要素が非表示の原因
期待値: 子要素に関係なく非表示になること
結果: 子要素に関係なくリンクは非表示になった
考察: aタグ自体になんらかの作用が働いている
ホスト名が非表示の原因
期待値: play.google.comのみ非表示になること
結果: play
, docs
, drive
.google.comいずれも表示されたままとなった
考察:
- ホスト名のみで判定している訳ではない様子
-
google.com
部分で弾いているという可能性はない
pathnameで判定しているか
期待値: フルパス(/store/apps/details
)の時に非表示になること
結果: /store/apps/details
も表示されたままとなった
考察: https://play.google.com/store/apps/details部分で判定していない。クエリパラメータまで見ていそう。
特定のクエリパラメータで判定しているか
期待値: id
を指定した時に非表示になること
結果:
パラメータ名 | 結果 |
---|---|
id | 非表示になる |
hl | 非表示になる |
gl | 非表示になる |
hoge | 非表示になる |
考察: hoge
のような適当なパラメータ名でも非表示になることから正規表現等で意図的に非表示にしていると判断
まとめ
- iOS 16(Safari 16.0)以降で入った仕様
-
https://play.google.com/store/apps/details
にクエリパラメータを付与すると非表示になる- クエリパラメータは何をつけても非表示になるので正規表現で弾いているように見える
- aタグのhref属性に指定した時のみ発生する模様
Discussion