Edit

Page

Page title:

Page body:

[40] 多くの [[Webブラウザー]]は、単独の[[アプリケーション]]としてだけでなく、
他の[[アプリケーション]]に組み込む (埋め込む) [[GUI]] 部品 ([[ウィジェット]]) として利用できる
[[API]] を有しています。

[9] 現代の [[OS]] のほとんどには[[Webブラウザー]]が標準搭載されており、
それを[[アプリケーション]]が[DFN[埋め込みブラウザー]]として利用できる [[OS]]
標準の [[API]] が提供されています。

[42] [[スマートフォンアプリ]]は機能の一部または全部を [[OS]] の提供する
[[Webブラウザー]]機能により実装していることがあり、これは[DFN[アプリ内ブラウザー]]や
[DFN[Webビュー]]などと呼ばれます。

* 機能

[24] [[埋め込みブラウザー]]は、通常の [[Webブラウザー]]と一部異なる動作をする
(できる) 場合があります。

** Web プラットフォームの機能

[1] 埋め込みブラウザーは、表示上は[[入れ子閲覧文脈]]のように見えるかもしれませんが、
それ自体が単独の [[Webブラウザー]]ですから、実際には[[最上位閲覧文脈]]です。
複数の[[最上位閲覧文脈]]を同時に持つことができるかは、実装次第です。

[5] 新しい[[最上位閲覧文脈]]を開くときは通常の [[Webブラウザー]]を使うような実装もあります。
新しい[[最上位閲覧文脈]]を開くオプションを提供せず、[[著者]]が新しい[[最上位閲覧文脈]]を求めた時であっても同じ[[最上位閲覧文脈]]を使い続けるような実装もあります。

[70] [[著者]]による [CODE(JS)@en[window.close]] が機能するかどうか、通常の [[Webブラウザー]]とは異なる判断基準が必要かもしれません。

-*-*-

[8] [[埋め込みブラウザー]]では、[[認証ダイアログ]]、 [[ServiceWorker]] や[[通知]]、[[全画面表示]]、
[[Geolocation API]] など、
提供されない機能があるかもしれません。

[10] [[navigate]] や [[fetch]] でアクセスできる範囲を[[アプリケーション]]から制約できることもあります。

;; [[navigate]]、[[navigation scope]] を参照。

-*-*-

[71] [[埋め込みブラウザー]]特有の不具合が生じることがあります。

[72] [[iOS]] の [[Safari]] を使った複数の[[アプリ]] ([[facebook]]、[[SmartNews]] など)
で、初期[[レンダリング]]時点の [[viewport]] の高さ ([CODE[innerHeight]] や
[CODE[[[position: fixed]]; [[top]]: 0; [[bottom]]: 0]] な[[要素]]の高さなど)
が実際の [[viewport]] の高さよりも大きい現象が確認されています。

[[viewport]] の上に[[アプリ]]側の[[ヘッダー]]があり、その部分が高さに含まれているようです。

読み込み中のいずれかの時点で再計算されているらしく、いつの間にか正しい値が返されるようになり、
[CODE[bottom]] の指定も正しい位置で[[レンダリング]]されます。
ひどいことに、再計算の際に [CODE[resize]] [[イベント]]は発生していません。
[TIME[2017-03-01T08:19:28.200Z]]

;; [73] [[ヘッダー]]部分の裏側に[[半透明]]で[[スクロール]]可能な上部の領域
(本来スクロールしないとレンダリングされないはずの部分) 
が少し見えるように実装されていたりもしますが、その辺も関係しているのでしょうか。

;; [75] [[履歴]]移動で謎の [CODE[resize]] が発生することはあるようです。

-*-*-

[125] 
実装上の制約などのために一部の (あってもなくても大きな支障はない) 機能が[[埋め込みブラウザー]]では省かれることがあります。
[SEE[ [[bfcache]] ]]

** 独自機能

[12] [[アプリケーション]]は、通常の [[Webブラウザー]]にない独自の [[API]]
を[[Webページ]]に提供できるかもしれません。

[11] 表示される[[Webページ]]が限定される場合、本来なら[[Web互換性]]に影響するような独自処理を[[アプリケーション]]が行えることもあります。

;; [25] ただ、[[相互運用性]]のため、そうした特殊な動作を使うのは、
一般の [[Webサイト]]ではなく、特定の[[アプリケーション]]の[[埋め込みブラウザー]]でのみアクセスする特別な
[[Webサイト]]に限定するべきです。

[112] 独自機能を追加する場合、
[[セキュリティー]]問題を十分に検討するべきです。

[EG[
[114] [[利用者]]が登録した[[個人情報]]にアクセスできる特別な [[API]] 
を持った[[埋め込みブラウザー]]を使って[[掲示板]]の
[[HTML]] データを表示する時、悪意ある[[利用者]]の投稿が当該 [[API]]
を使ってデータを取得できてしまわないよう注意が必要となります。
]EG]

[EG[
[113] 
[[埋め込みブラウザー]]を受信した[[メール]]の [[HTML]]
の表示と[[利用者インターフェイス]]の機能の実装の両方に使っている [[MUA]]
では、任意の第三者から送られてくる可能性がある[[メール]]の [[HTML]]
の表示で独自機能を使えてしまわないように注意しなければいけません。
]EG]

** 独自のセキュリティーモデル

[97] 
[[埋め込みブラウザー]]によっては、埋め込んだ[[アプリケーション]]の独自の[[セキュリティーモデル]]の採用を認めていることがあります。
例えば、[[同一起源ポリシー]]が一部緩和されていたり、
通常の [[Webサイト]]では認められないはずの [[URL]] への[[リンク]]が認められていたりするかもしれません。

[98] 
しかし、慎重に設計されている本来の [[Web]] の[[セキュリティーモデル]]を崩すことになりますから、
[[セキュリティー]]への影響を十分検証する必要があります。
ちょっと不便だから程度の理由で行うべきではありません。

[EG[
[99] 
例えば、[[SNS]] の[[投稿]]の [[HTML]] を表示する時、
通常の [[Webブラウザー]]なら何も起こらないはずの悪意あるコードが、
セキュリティーの制約が緩和された[[埋め込みブラウザー]]では悪意通りに動作し、
[[利用者]]に害をもたらす危険性があります。
]EG]

** 識別情報

[6] 埋め込みブラウザーは、埋め込んだ[[アプリケーション]]の独自の [CODE(HTTP)@en[[[User-Agent:]]]]
や [CODE(JS)@en[[[navigator.userAgent]]]] の値を使うこともあれば、
元の [[Webブラウザー]]の共通の値を使うこともあります。

[22] 一般の[[Webサイト]]を表示できる[[アプリ内ブラウザー]]であれば、
[[Webサイト]]側が [CODE(HTTP)@en[User-Agent:]] や [CODE(DOMi)@en[Navigator]]
によって挙動を変えることがあるので (ひどい話です)、[[相互運用性]]のため、
元の値を変えるべきではありません。

[23] しかしアクセス対象が特定のサイトに限定されており、通常の [[Webブラウザー]]に無い特殊な機能を提供する場合には、
通常のアクセスとの区別のため、あるいは統計のため、異なる値を使う方が好ましいかもしれません。

[116] 
ただし、
[CODE[User-Agent:]]
は[[セキュリティー]]機能ではありません。
[CODE[User-Agent:]]
の値によって正規の[[アプリ]]か否かを判断してはいけません。

** Web 互換性との関係

[78] [SEE[ [[Web互換性]] ]]

** API

[117] 
[[アプリケーション]]にブラウザーを埋め込む方法 ([[API]]) は、製品ごとに異なっています。
[[標準化]]された方法はありません。

[80] 
[[HTML]] の拡張:
[CODE[<iframe sandbox>]],
[CODE[<iframe mozbrowser>]],
[CODE[<wevview>]],
[CODE[<x-ms-wevview>]],
[CODE[<portal>]],
[CODE[<fencedframe>]]

* 単独 Web ブラウザーとの関係

[43] こうした埋込み型 [[Webブラウザー]]は、単独の [[Webブラウザー]]と
(あるいは埋め込みブラウザー同士で) [[Cookie]]
や[[フォーム]]、表示[[履歴]]等のデータを共有していることもありますが、大抵は別管理になっています。

;; [2] 意図せず [[Cookie]] や[[認証]]などの情報が共有され、
[[Webブラウザー]]側の [[Webアプリケーション]]のセッションと外部の[[アプリケーション]]の情報が紐付けられてしまうことは避けなければなりません。
[EG[
[3] 例えば [[MUA]] の[[埋め込みブラウザー]]と通常の [[Webブラウザー]]で [[Cookie]]
が共有されていると、[[メールアドレス]]と [[Webアプリケーション]]の[[アカウント]]が意図せず紐付けされる危険性があります。
]EG]

;; [18] 単独の [[Webブラウザー]]と埋め込みブラウザーとで情報が共有されていて、
埋め込みブラウザーに特定アプリケーション用の特別な機能が提供されていると、
悪意ある第三者が当該アプリケーション製作者の想定しない方法でその機能を呼び出すことができる
(当該アプリケーション内ではあり得ない形の情報を単独の [[Webブラウザー]]で通常の方法で保存し、
埋め込みブラウザーからそれを利用させることができる) かもしれず、
[[セキュリティー]]上の懸念となり得ます。

* 重複

[105] 特定の[[埋め込みブラウザー]]の版を用いたい、
あるいは[[プラットフォーム]]の[[埋め込みブラウザー]]の版が古すぎる、
といったような理由で、[[アプリケーション]]が[[埋め込みブラウザー]]を完全に組み込んだ形で利用される場合もあります。
(当該[[アプリケーション]]の開発者にとっては既存の[[埋め込みブラウザー]]の流用ですが、
[[プラットフォーム]]や他の[[アプリケーション]]や[[利用者]]から見れば
[[Webブラウザー]]機能が含まれる独自の[[アプリケーション]]ということになります。)

[EG[
[106] ある時期の [[Android]] には、古い [[WebKit]] から派生して開発が止まった
[[Android Browser]] と最新の [[Chrome]] があって、
どちらも同じ系譜の[[レンダリングエンジン]]を用いていたものの、
実装としては完全に別物でした。
]EG]

[EG[
[107] ある[[ゲーム]]専用[[プラットフォーム]]では、
[[プラットフォーム]]同梱の複数の特別な[[アプリケーション]]がそれぞれ異なる
[[WebKit]] 派生 [[Webブラウザー]]を組み込んでおり、
それらとはまた別に単独の [[Webブラウザー]]も提供されていたといいます。
]EG]

* 利用者インターフェイス

[45] 埋込み型 [[Webブラウザー]]は当該[[アプリケーション]]と統合された [[UI]]
を提供できることから、より良い[[利用者体験]]を提供できる可能性があります。
一方で用途によっては機能の少ない [[Webブラウザー]]でしかなく、[[利用者]]に不便を強いたり、
[[セキュリティー]]上の問題を生じたりすることもあります。

[EG[
[46] 例えば任意のページを表示できる [[Webブラウザー]]機能を組み込みながら、
そのページの [[URL]] や [[TLS証明書]]の情報を表示できないような場合には、
[[フィッシング]]などに悪用される危険性があります。

;; [[アドレスバー]]参照。
]EG]

[EG[
[48] 例えば[[リンク]]を新しい[[窓]]で開く機能が埋め込み [[Webブラウザー]]では提供されないかもしれず、
[[利用者]]は不便に思うかもしれません。
]EG]

;; [49] [[OAuth]] を埋め込み [[Webブラウザー]]で実装するのは好ましくないと考えられています。
([[認可エンドポイント]]参照。)

[61] 一般的な [[Webブラウザー]]であれば [[Webサイト]]に通知されたり、
[[利用者]]の操作に割り当てられていたりする操作が、
[[埋め込みブラウザー]]の場合埋め込まれている[[アプリケーション]]に奪われて利用できないことがあります。

[[アプリケーション]]の開発者としては[[アプリケーション]]の他の機能との整合性や、
[[利用者]]の利便性を考えてそのように設計しているのでしょうが、
実際には[[利用者]]に通常の [[Webブラウザー]]と違う体験を押し付けて困惑させるだけだったりします。

[EG[
[62] 例えば、「[[戻る]]」ボタンが [[Webブラウザー]]の[[履歴]]の移動操作ではなく、
[[アプリケーション]]の独自の遷移操作に関連付けられていて、
[[埋め込みブラウザー]]内の[[履歴]]の「[[戻る]]」操作ができないことがあります。
]EG]

[EG[
[63] 例えば、[[スワイプ]]が[[アプリケーション]]独自の操作に関連付けられていて、
[[Webアプリケーション]]の操作のうち[[アプリケーション]]に[[スワイプ]]と判断されてしまうものができないことがあります。
]EG]

[EG[
[74] [[SmartNews]] は[[アプリ内ブラウザー]]の上に重ねて[[履歴]]の移動
([[戻る]]・[[進む]]) のボタンを提供しています。位置は左下 (端からは少し離れた場所)
に固定されており、変更はできないようです。

[[Webページ]]の下側に [CODE[position: fixed]] で固定の内容を表示しているような
[[Webサイト]]では、[[スクロール]]もできず、重なった部分に何があるか[[利用者]]が知ることができません。
]EG]

-*-*-

[77] 一般の [[Webサイト]]を閲覧できる[[埋め込みブラウザー]]は、
表示中の [[Webページ]]を[[プラットフォーム]]の[[標準のWebブラウザー]]で開くことを[[利用者]]が指示できる手段を提供しているのが普通です。

[115] 一般に[[アプリ内ブラウザー]]は任意の [[Webサイト]]の快適な閲覧に十分な機能を提供していないので、
[[利用者]]に[[標準のWebブラウザー]]を使う選択肢を与えることは重要です。

-*-*-

[109] [[アプリケーション]]の実装手段としてのみ用いられ特定の
[[Webページ]]しか表示しない[[埋め込みブラウザー]]は、
[[利用者]]が[[Webブラウザー]]であると認知できないくらいに[[利用者インターフェイス]]に馴染ませてあるかもしれません。

;; [[プラットフォーム]]の機能や[[サーバー]]との連携方法次第では、
完全に[[ネイティブアプリ]]の機能を使って[[アプリケーション]]を開発するよりも、
一部を [[Webアプリケーション]]として実装する方が楽なこともあります。
そうした開発手法を[[バズワードの HTML5][HTML5 (バズワード)]]と言ったり、
ハイブリッドと言ったりすることもあります。

* Web サイトの著者から見た埋め込みブラウザー

[26] [[Webサイト]]の性質にも依存しますが、一般の [[Webサイト]] 
[WEAK[(自身の提供する[[ネイティブアプリケーション]]が[[埋め込みブラウザー]]を使っているわけではないもの。)]]
であっても、[[埋め込みブラウザー]]からアクセスされることは十分にあり得ます。

[EG[
[27] 例えば、 [[Facebook]] 内でその[[Webサイト]]の [[URL]] が[[共有]]されると、
[[Facebook]] の[[スマートフォンアプリ]]の[[利用者]]は、
[[アプリ内ブラウザー]]でそのサイトを開くことがあります。
]EG]

[EG[
[28] 例えば、  [[SmartNews]] に掲載された[[Webページ]]やそこから[[リンク]]されている
[[Webページ]]は、 [[SmartNews]] の[[アプリ内ブラウザー]]で開かれます。
]EG]

[29] そうした[[埋め込みブラウザー]]の利用は、 [CODE(HTTP)@en[User-Agent:]]
などで判断できることもあれば、元の [[Webブラウザー]]と区別できない可能性もあります。

[13] [[Google Analytics]] では、 [[Safari]] の[[アプリ内ブラウザー]]からのアクセスは
[DFN[Safari (in-app)]] と表示されます。

;; ほぼ、 [[iOS]] の[[アプリ]]からのアクセスだと思われます。

[103] 
先述の通り[[アプリ内ブラウザー]]は当該[[アプリ]]の独自仕様・[[不具合]]が含まれていることがあり、
[[アドレスバー]]や[[開発者ツール]]がないため[[デバッグ]]が困難だったり、
そもそも[[アプリ内ブラウザー]]固有の問題であると気づきにくかったりして、
困惑している[[Web開発者]]もいます。

[119] 
本来の[[Webブラウザー]]と同等の機能を提供できない[[アプリ内ブラウザー]]は欠陥製品だという認識を、
[[アプリ]]の開発者が持ってほしいものですがね...
同等の機能を提供できない、
同等かどうか自身を持てないレベルの開発者は、
任意の[[Webサイト]]を閲覧可能な[[アプリ内ブラウザー]]を使わんでほしい。

[120] 
そんな実情があるので [[Web開発者]]としてはいっそ[[アプリ内ブラウザー]]は全部ブロックしたい勢いなんだが、
[[アプリ内ブラウザー]]を確実に識別する方法はないし、
使いたい機能が揃っているか個別に検査するのも限界があるからなあ。

* アプリケーションへの信用

[64] [[埋め込みブラウザー]]を利用するということは当該[[アプリケーション]]の[[開発者]]が任意の 
[[Webページ]]の内容にアクセスできる可能性があるということです。

[EG[
[65] A社の[[アプリケーション]]に埋め込まれた [[Webブラウザー]]で A社と無関係のB社の
[[Webサイト]]を利用して[[クレジットカード]]決済すると、
[[利用者]]の知らないうちに[[クレジットカード]]情報がA社に送信されてしまう危険性があります。
]EG]

[66] もちろんこれは通常の [[Webブラウザー]]や[[オペレーティングシステム]]にも言えることですが、
そうした[[プラットフォーム]]の[[開発者]]に対しては[[利用者]]ははじめから全面的に信用していると考えられます。

[EG[
[67] [[iPhone]] や [[Safari]] を利用するということは、その[[開発者]]である [[Apple]]
を信用してデータを預けることを意味しています。 [[Apple]] を信用できないなら、
[[iPhone]] を使うべきではないでしょう。
]EG]

[68] [[利用者]]は、単なる[[アプリ]]に対してはそこまで思慮深く検討していないかもしれません。
ですが、自衛のため、むやみに[[アプリ内ブラウザー]]で無関係の 
[[Webサイト]]を閲覧することがないよう注意するべきです。

[69] [[アプリケーション]]の可能な操作を制限して[[利用者]]を保護する機能を持つ[[プラットフォーム]]は、
[[アプリ内ブラウザー]]の機能も適切に制限したり、[[利用者]]の確認を得たりするべきです。

[REFS[
- [36] [CITE@ja[つい開いてしまうアプリ内ブラウザには要注意。機密情報を入力するならSafariのほうがいい | ライフハッカー[日本版]]]
([TIME[2017-01-20 14:25:18 +09:00]])
<http://www.lifehacker.jp/2014/10/141001inappbrowser.html>
]REFS]

[123] 
[[TikTok]] などは[[中華人民共和国]]政府に[[アプリ内ブラウザー]]の[[個人情報]]を無断送信しているなどとしてセキュリティー研究者や各国政府の調査対象になっています。
[SEE[ [[TikTok]] ]]

[122] [CITE@ja[Felix KrauseさんはTwitterを使っています: 「When opening a website from within the TikTok iOS app, they inject code that can observe every keyboard input (which may include credit card details, passwords or other sensitive information) TikTok also has code to observe all taps, like clicking on any buttons or links. https://t.co/Dcv0N4ccKD」 / Twitter]], 午前6:06 · 2022年8月19日 [TZ[+09:00]], [TIME[2022-08-20T14:08:23.000Z]] <https://twitter.com/KrauseFx/status/1560372509639311366>

[140] [CITE@ja[スマホアプリ内ブラウザでのコンテンツ表示に関する注意喚起 | JSSEC]], [TIME[2023-08-02T05:48:38.000Z]] <https://www.jssec.org/column/20220824-2.html>

[144] 
[CITE@en[Modernizing OAuth interactions in Native Apps for Better Usability and Security — Google for Developers Blog - News about Web, Mobile, AI and Cloud]], [TIME[2023-10-01T07:37:16.000Z]], [TIME[2023-10-02T09:23:19.416Z]] <https://developers.googleblog.com/2016/08/modernizing-oauth-interactions-in-native-apps.html>

[145] [CITE@ja[「Google でログイン」の問題を解決する - Google アカウント ヘルプ]], [TIME[2023-10-02T09:24:41.000Z]] <https://support.google.com/accounts/answer/12917337?hl=ja#zippy=%2Cdisallowed-useragent>

>「403 disallowed_useragent」というエラーが表示された場合は、アプリで埋め込みの WebView が使用されています。一部のデベロッパーは、WebView を使用してアプリ内のウェブ コンテンツを表示しています。その場合、サードパーティがユーザー / Google 間の通信にアクセスして変更できる可能性があるため、セキュリティが万全とはいえません。
>
アカウントのセキュリティを強化するため、埋め込み WebView のサポートは 2021 年 9 月 30 日をもって終了しました。

* 埋め込みブラウザーによる Web ブラウザー

[91] 歴史的に [[Webブラウザー]]の[[レンダリングエンジン]]は[[利用者インターフェイス]]と不可分でしたが、
[[埋め込みブラウザー]]の仕組みを実装することにより、他の [[Webブラウザー]]の[[レンダリングエンジン]]を使った
[[Webブラウザー]]が実現可能となりました。

[92] 既存の [[Webブラウザー]]の[[レンダリングエンジン]]を流用できるため、
[[Webブラウザー]]への参入障壁が大幅に低下しました。
それらは、本家 [[Webブラウザー]]と、あるいは他の同種の [[Webブラウザー]]と、
[[利用者インターフェイス]]や [[Web互換性]]に影響しない付加価値で競争することになります。

;; [93] [[利用者]]は本家の [[Webブラウザー]]も[[インストール]]する必要がありますが、
[[Webブラウザー]]が[[プラットフォーム]]の標準コンポーネントとなったことで、
[[利用者]]はそれを意識する必要がありません。

[95] 主要な [[Webブラウザー]]が[[タブ]]機能を実装していなかった時代には、
[[タブブラウザー]]が人気を博しました。

[96] [[Trident]]、[[Gecko]]、[[WebKit]] など複数の[[レンダリングエンジン]]を組み込み、
[[利用者]]が必要に応じて切り替えられる[[Webブラウザー]]もありました。

[94] [[iOS]] では任意の[[プログラム]]を実行可能な[[アプリ]]を公式の [[App Store]] 
で配布することを [[Apple]] が規制しているため、[[プラットフォーム]]の標準の
[[WebKit]] を使う以外に [[Webブラウザー]]を配布する手段がありません。
従って、 [[iOS]] 向けに [[App Store]] で配布されている [[Webブラウザー]][[アプリ]]は、
([[Opera Mini]] のような例外を除き) すべて同じ[[レンダリングエンジン]]で[[レンダリングエンジン]]のみ異なるものです。

-*-*-

[76] [[Google Chrome Frame]] は、 [[IE]] に [[Chrome]] を[[埋め込みブラウザー]]として組み込むものでした。

* アプリ内ブラウザーを使わせない

[126] 
今や多くの[[スマホアプリ]]が[[アプリ内ブラウザー]]機能を持っていますが、
標準的な[[Webブラウザー]]より機能が劣り、
正常に動作しない[[Webサイト]]が多いのが困りものです。
[[Webサイト]]開発者にとっても動作確認が面倒な上に[[アプリ]]判定が難しく、
[[アプリ]]の更新でも挙動が変わり得るので、対策は困難です。

[127] 
いくつかの[[アプリ]]は、[[利用者]]が[[アプリ内ブラウザー]]を使うか標準の[[Webブラウザー]]を使うかを設定で変更できます。
いくつかの[[アプリ]]は、いったん[[アプリ内ブラウザー]]で開いた[[Webページ]]を標準の[[Webブラウザー]]で開き直すボタンなりメニューなりを用意しています。
知識の少ない[[利用者]]には難しく、そうでなくても[[利用者]]に無駄な手間をかけさせる酷い仕様ですが
([[UX]] がどうのこうのといつも偉そうな講釈を垂れる「専門家」達もなぜかこういう機能には何も言いませんね、不思議です)、
こうした回避機能を提供しているだけまだマシな部類です。

[REFS[

- [139] [CITE@ja[「超うざいよね?」LINEのアプリ内ブラウザを無効/オフにする手順/注意点!]], [TIME[2023-08-01T15:17:13.000Z]], [TIME[2023-08-02T05:46:49.647Z]] <https://webmobile.net/line-in-app-browser-0117/>

]REFS]

-*-*-

[129] 
[[LINE]]
は、
[[URL query]]
で

>
,*クエリパラメータ付きのURL 	,*説明
,https://example.com/?[CODE[openExternalBrowser=1]] 	,対象のURLを外部ブラウザで開きます。
,https://example.com/?[CODE[openInAppBrowser=0]] 	,対象のURLをChromeカスタムタブで開きます。(Android版LINEのみ対応)[SUP[__&&[&&__1__&&]&&__]]

のように指定して、 [[URL]] をどの[[Webブラウザー]]で開くか個別に指示できます。
[SRC[>>128]]

[130] 
この [[URL query]] はどの [[HTTP URL]] にも付けられるようです。
本来[[サーバー]]がその解釈を定めるべき (で[[サーバー]]以外にはその決定権がない)
[[URL query]] を濫用するのは、設計者の技術的センスの欠如以外の何者でもありませんが、
先述の通りこうした回避機能があるだけまだマシです。

[132]
[[サーバー]]が既に [[URL query]] を使っている場合は、
その末尾に [CODE[&]] で区切って繋げてやっても動作するようです。
[SRC[>>131]]
末尾以外の途中でも同じように動作するのかは未検証です。

[133] 
当然ながら、たまたま同名の [[query]] を[[サーバー]]が使っている場合は、
誤動作のおそれがあります。また、 [[query]] で[[引数]]構文以外が使われる場合
([[HTTP]] および [[URL]] の仕様上まったく正当で、
決定権は[[サーバー]]だけにあります)、
この指定を付け加えることができません。

[134] 
[[LINE]] で正常に扱えるためには [[LINE]] の決めた仕様に従えというのは、傲慢です。
[[HTTP]] も [[URL]] も [[LINE]] のものではありません。

[135] 
しかしながら、繰り返しますが、このような機能を提供しているだけ [[LINE]]
には良心の欠片が残っているのであり、他の[[アプリ]]にはこのような回避機能がありません。

;; [136] まあ良心というより苦情が多かったからかもしれませんが、
他の[[アプリ]]にも苦情は同じくらい届いているのではないでしょうか。

;; [137] [[LINE]] や他の[[アプリ]]の提供者にどれだけ苦情が来ているのかしりませんが、
世の[[Webアプリケーション]]開発者のところにはこうした[[アプリ内ブラウザー]]絡みの苦情がしょっちゅう届いているんですよ。
しかもそのほとんどの[[利用者]]は[[アプリ内ブラウザー]]が原因だと気づかないので (そりゃそうだ)、
「なんかわからないけど動かない」みたいな意味不明な不具合報告を苦労して分析してるんです。

[REFS[

- [128] [CITE@ja[LINE URLスキームでLINEの機能を使う | [[LINE]] Developers]], [TIME[2023-08-02T03:04:53.000Z]], [TIME[2023-08-02T03:45:42.080Z]] <https://developers.line.biz/ja/docs/messaging-api/using-line-url-scheme/#opening-url-in-external-browser>
- [131] [CITE@ja[LINEに投稿したリンクを、強制的に外部ブラウザで開かせたい | しらこのナレッジ]], [TIME[2022-07-20T15:05:49.000Z]], [TIME[2023-08-02T03:48:55.964Z]] <https://tecchan.jp/entry/211218-lineurl/>

[FIG(quote)[
[FIGCAPTION[
[141] 
[CITE@ja[LINEのアプリ内ブラウザでWebページを表示させる際に正常に動作しない場合はどうしたら良いですか? | LINE for Business]], 
2022/08/12,
[TIME[2022-08-02T05:50:05.000Z]], [TIME[2023-08-02T05:50:20.085Z]] <https://faq.linebiz.com/help/s/article/000002119?language=ja>
]FIGCAPTION]

>アプリ内ブラウザで問題が起きる場合は、パラメータを付与して外部ブラウザへの遷移を推奨しています。(詳細は[ASIS[こちら][リンク]] )
>※アプリ内ブラウザはOSのwebviewの仕組みを利用しています。

]FIG]

]REFS]

* 利用動向

[101] 
従来[[埋め込みブラウザー]]は特定の[[アプリケーション]]の専用の動作を実現するため、
あるいは[[プレビュー]]のような補助的な使い方をするために使われており、
専用の [[Webブラウザー]]を使わずに[[埋め込みブラウザー]]を使うのは一般的とはいえませんでした。

[102] 
しかし[[2010年代]]後半の [[SNS]] などの[[スマートフォンアプリ]]の普及により、
[[Web]] 外で交換された [[URL]] を[[アプリ内ブラウザー]]で開く使い方がかなり増えてきました。
例えば [[LINE]] や [[Facebook]] で[[共有]]された [[Webページ]]を
[[LINE]] アプリや [[Facebook]] アプリ内で開くというもので、
[[Webサイト]]の利用者層によってはアクセスの大部分が[[アプリ内ブラウザー]]というケースすらあります。

[121] 
最近はどうなのか知りませんが、
以前は 
[[iOS]]
は複数の[[アプリ]]の切り替えが [[UI]] 的に分かりにくかったので、
[[Webサイト]]を表示したい時に [[UX]] がどうこうとかイキった開発者が[[アプリ内ブラウザー]]を使いたいがちだったそうです。
一方 
[[Android]]
は当時も[[アプリ]]の切り替えが普通に行えたので、
[[Androidアプリ]]にはそのような慣習はなかった
(ただし [[iOS]] と仕様を揃えるため[[アプリ内ブラウザー]]を使う[[アプリ]]も少なくなかった)
らしいです。

* 製品

[FIG(short list)[ [20] [[埋め込みブラウザー]]製品
- [[MSHTML]]
- [[HTMLayout]]
- [[UIWebView]]
- [[WKWebView]]
- [[SFSafariViewController]]
- [[Android WebView]]
- [[Chrome Custom Tabs]]
- [[NetFront Browser NX]]
- [[PhantomJS]]
- [[XAML]] [CODE(XMLe)@en[WebView]]
- [CODE[Titanium.UI.WebView]]
- [[Chrome Apps]] [CODE(HTMLe)@en[webview]]
- [[XUL]] [CODE(XMLe)@en[browser]]
- [CODE(XMLe)@en[x-ms-webview]]
- [[React Native]] [CODE[WebView]]
- [[Electron]] [CODE(XMLe)@en[webview]]
- [[NW.js]] [CODE(HTMLe)@en[webview]]
- [[Headless Chromium]]
- [[Chromium Embedded Framework]]
- [[Trusted Web activity]]
- [[JSHTML]]
]FIG]

[124] 
広く一般に公開されているものもあれば、
特定製品専用のものもあります。

-*-*-

[138] 
よくトラブルが報告される[[アプリ内ブラウザー]]事例:

- [[Facebook]] スマホアプリ
- [[LINE]] スマホアプリ
- [[Gmail]] スマホアプリ
- [[SmartNews]]

* 関連

[30] 本項の[[埋め込みブラウザー]]は、単に [[Webページ]]内に [CODE(HTMLe)@en[iframe]]
[[要素]]を置いただけのもの ([[入れ子閲覧文脈]]) とは異なります。

[EG[
[110] [[入れ子閲覧文脈]]は (条件が整えば) [[DOM API]]
を通じて「外側」にアクセスできますが、
[[埋め込みブラウザー]]では基本的にそんなことはありません。
]EG]

[EG[
[111] [[入れ子閲覧文脈]]は [CODE[X-Frame-Options:]] の制約を受けますが、
[[埋め込みブラウザー]]では制約を受けません。
その他[[第三者]]としての制約の影響を受けません。
]EG]

[44] より発展したものとして、 [[Webブラウザー]]の[[レンダリングエンジン]]等を流用したアプリケーション実行環境が
[[OS]] の標準機能として、あるいは開発環境等と共に提供される実行環境として用意されていることがあります。

[EG[
[15] [[HTA]] や [[AIR]] や [[XULRunner]] のような例があります。
]EG]

[14] その場合、当該実行環境上のアプリケーションとしての[[レンダリング]]の一部として、
埋込み型の [[Webブラウザー]]が用意されることもあります。

[EG[
[47] 例えば [[Chrome Apps]] には、 [CODE(HTMLe)@en[[[webview]]]] [[要素]]があります。
[CODE(HTMLe)@en[[[iframe]]]] [[要素]]とは違って、[[最上位閲覧文脈]]を作成するものになりますから、
埋め込み [[Webブラウザー]]と理解するべきものです。
]EG]

[EG[
[16] [[XUL]] には [CODE(XMLe)@en[browser]] [[要素]]があります。
]EG]

[EG[
[17] [[WinJS APIs]] には [CODE(HTMLe)@en[x-ms-webview]] [[要素]]があります。
]EG]

[7] [[Chrome Custom Tabs]] も参照。

[19] [[ネイティブアプリケーション]]の通常の方法ではなく
[[Webビュー]] ([[埋め込みブラウザー]]) を使う開発手法を
[[HTML5][HTML5 (バズワード)]]、あるいは ([[HTML5][HTML5 (バズワード)]]
と[[ネイティブアプリケーション]]の) [[ハイブリッド]]と呼ぶ人もいるようです。

;; ただし「[[ハイブリッド]]」という言葉の意味は曖昧で、 [[Titanium]]
のような開発方式を指すことなどもあります。

* 歴史

[41] 古くは [[IE]] が [[Windows]] 標準の [[Webブラウザー]]コンポーネントとして提供されており、
これを組み込んだ [[Windows]] アプリケーションがいくつもありました。

;; [4] [[Windows]] の[[ネイティブアプリケーション]]の開発者には、
この機能を提供した点において [[IE]] は好評でした。 [[Netscape]]
その他 [[Microsoft]] 以外の ([[OS]] 標準でない) 
[[Webブラウザー]]を同様の形で[[アプリケーション]]に組み込むのは困難でした。

* メモ

[21] [CITE[アプリ内ブラウザと広告配信についての調査結果 - Qiita]]
([TIME[2017-01-20 11:25:34 +09:00]])
<https://qiita.com/ta__ho/items/2fc8e02b1bb8f99883d7>

[31] [CITE[Android のアプリ内ブラウザについてのまとめ - Qiita]]
([TIME[2017-01-20 14:19:48 +09:00]])
<https://qiita.com/otofu-square/items/3153dc75438acb3f71d0>

[32] [CITE@ja[Android 版 LINE にアプリ内ブラウザが実装されてしまったが無効にする設定が見つからない | Lonely Mobiler]]
([TIME[2017-01-20 14:21:49 +09:00]])
<http://loumo.jp/wp/archive/20160702120051/>

[33] [CITE@ja-JP[Yahoo! JAPANアプリヘルプ(Android向け) - アプリ内ブラウザーについて]]
([TIME[2017-01-20 14:22:19 +09:00]])
<https://m.yahoo-help.jp/app/answers/detail/p/690/a_id/46754>

[FIG(quote)[
[FIGCAPTION[
[34] [CITE@ja[アプリで外部サイトを開くとき、なぜiOSとAndroidとでは動きが違うのか (1/3):MarkeZine(マーケジン)]]
([TIME[2017-01-20 14:24:07 +09:00]])
<https://markezine.jp/article/detail/20256>
]FIGCAPTION]

>  つまり、iOSではAndroidのようなハードウェア上の「戻る」ボタンがないので、「ホーム」あるいは「プロセス一覧」を経由しないと、元のアプリに戻ることができないのです。

]FIG]

[35] [CITE@ja[アプリ内ブラウザでSafariを開くことが出来る連携機能Browsecurely|キセノンテンター]]
([TIME[2017-01-20 14:24:57 +09:00]])
<http://xenontenter.com/browsecurely/>

[37] [CITE@ja[アプリ内ブラウザがさらに使いやすく iOSアプリバージョン3.4をリリースしました - はてなブックマーク開発ブログ]]
([TIME[2017-01-20 14:26:04 +09:00]])
<http://bookmark.hatenastaff.com/entry/2015/12/22/112353>

[FIG(quote)[
[FIGCAPTION[
[38] [CITE@ja[【お知らせ】LINEなどの「アプリ内ブラウザ」をご利用のお客様へ -おトク de キレイ(オトクデキレイ)-]]
([TIME[2017-01-20 14:26:35 +09:00]])
<http://point.cosme.net/information/detail/1075>
]FIGCAPTION]

> おトク de キレイでは「アプリ内ブラウザ※」をご利用の場合、全てのコンテンツにおいてコイン付与の対象外となります。

]FIG]

[FIG(quote)[
[FIGCAPTION[
[39] [CITE@ja[カタチップ | アプリ内ブラウザの注意点]]
([TIME[2017-01-20 14:28:44 +09:00]])
<http://kata-tip.com/application-browser-important>
]FIGCAPTION]

> ※2015年4月現在
> アプリ内ブラウザの注意点
> アプリ内ブラウザ(Twitter)などはキャッシュが強く残ると更新しても修正が反映されない場合がある。
> キャッシュをすぐに消すにはアプリを削除し再インストールしなければならないので要注意です。
> 参考にさせていただいた記事
> http://mosap.net/twitter-for-ios-issues

]FIG]

[FIG(quote)[
[FIGCAPTION[
[50] [CITE@ja[アプリ内ブラウザの「戻る」機能 — Website Usability Info]]
([TIME[2017-01-20 14:29:31 +09:00]])
<http://website-usability.info/2013/07/entry_130718.html>
]FIGCAPTION]

> アプリ内のブラウザ機能でいくつかの Web ページを遷移しているとき、画面左上にあるアイコン (「戻る」ボタンっぽいもの) をタップしたら、直前に見ていた Web ページではなく、Web ページを開く前のコンテンツに一気に引き戻された...という経験は、ありませんか?

]FIG]

[FIG(quote)[
[FIGCAPTION[
[51] [CITE@ja[子どもの「フィルタリング」はLINEでは無効だ | イマドキのLINE事情 | 東洋経済オンライン | 経済ニュースの新基準]]
([TIME[2017-01-20 14:30:21 +09:00]])
<http://toyokeizai.net/articles/-/128148?page=4>
]FIGCAPTION]

> しかし、ブラウザ型フィルタリングを利用していても、LINEでシェアされたURLはLINEのアプリ内ブラウザで表示されるため、フィルタリングされません。LINEだけでなく、TwitterやFacebookといったSNSアプリやニュースアプリなど、アプリ内ブラウザ機能を持つアプリは同様です。

]FIG]

[FIG(quote)[
[FIGCAPTION[
[52] [CITE@ja[FacebookやTwitterのアプリ内ブラウザで画面高さが適切にとれない - naosk8's blog]]
([TIME[2017-01-20 14:31:47 +09:00]])
<http://naosk8.hatenablog.com/entry/2016/04/18/091548>
]FIGCAPTION]

> 今回は、TwitterやFacebookのアプリ内ブラウザ(embedded browser) に
> フッターの固定メニューが正しく表示されない事態が発生したので、
> その解消の経緯をメモ。
> inappbrowserキライ。
>  
> 結論
> inappbrowserでは、
> innerWidthなどは、URLやステータスバーなどの表示領域を含まれる、
> ブラウザ全体の高さを取得してしまうのでNG。

]FIG]

[53] [CITE@ja[ブラウザかWebViewか、どちらで開かれたのかを判別するには - console.lealog();]]
([TIME[2017-01-20 14:39:07 +09:00]])
<http://lealog.hateblo.jp/entry/2014/10/09/130344>

[54] [CITE@ja[T28_tatsuyaさんのツイート: "本当だ!ツイッターのアプリ内ブラウザだと、つぶやくページに行けない_(:3 」∠ )_ 他のブラウザで開いてやって下さい、、、_(:3 」∠ )_ RT:@xxsanzashixx: あたったあと、つぶやく!押すと、白い画面になると思う…"]]
([TIME[2017-01-20 14:39:17 +09:00]])
<https://twitter.com/t28_tatsuya/status/618716728474755072>

[55] [CITE@ja[iOSのアプリ内Webブラウザーでコピペメニューが表示されない場合の対処方法]]
([TIME[2017-01-20 14:40:17 +09:00]])
<http://hitoriblog.com/?p=38274>

[FIG(quote)[
[FIGCAPTION[
[56] [CITE[アプリ内ブラウザについて]]
([[© 2013 qixil.]]著, [TIME[2017-01-20 14:41:15 +09:00]])
<https://qixil.jp/q/3666>
]FIGCAPTION]

> フォーム内に画像添付を使用しており標準ブラウザからアクセスすると問題なく動作するのですが
> LINEやQRコードアプリなどのアプリ内ブラウザからアクセスすると画像添付に不具合が生じてしまいます。

]FIG]

[FIG(quote)[
[FIGCAPTION[
[57] [CITE@ja[Android版LINEから開いたページで画像を保存できない場合の対策 | LINEの仕組み]]
([TIME[2017-01-20 14:41:45 +09:00]])
<http://did2memo.net/2016/07/03/naver-line-save-image-in-app-browser/>
]FIGCAPTION]

> 「Android版LINE 6.4.1 にアップデートしたらLINEブログの画像が保存できなくなった」という話を聞いて確認してみたところ、その原因は、Android版LINEがリンク先をアプリ内ブラウザ( アプリの中にウェブブラウザの機能が埋め込まれたもの)で開くようになり、そのアプリ内ブラウザでは、画像を長押ししてもメニュその場合の対策を紹介します。

]FIG]

[FIG(quote)[
[FIGCAPTION[
[58] [CITE@ja[iOSのアプリ内ブラウザから、個人情報を盗まれる可能性が…|ギズモード・ジャパン]]
([TIME[2017-01-20 14:42:32 +09:00]])
<http://www.gizmodo.jp/2014/09/ios_21.html>
]FIGCAPTION]

> Twitterificの開発者の1人であるCraig Hockenberry氏によると、アプリ内ブラウザはキーボード入力を監視できるようなのです。
> iOSのアプリ内ブラウザでキーボード入力すると、たとえセキュアなパスワードの入力欄であっても、アプリ側は入力した文字を抽出できてしまうそうです。というのも、アップルのアプリ開発ガイドラインに従うため、アプリ内ブラウザはSafariのOAuth認証を使わないからなのです。

]FIG]

[FIG(quote)[
[FIGCAPTION[
[59] [CITE@ja[Web ビュー]]
([[Jwmsft]]著, [TIME[2017-01-20 14:43:28 +09:00]])
<https://msdn.microsoft.com/ja-jp/windows/uwp/controls-and-patterns/web-view>
]FIGCAPTION]

> Web ビュー コントロールは、Microsoft Edge レンダリング エンジンを使って、Web コンテンツをレンダリングするアプリにビューを埋め込みます。 また、Web ビュー コントロールでは、ハイパーリンクの表示と動作が可能です。

]FIG]

[FIG(quote)[
[FIGCAPTION[
[60] [CITE@en[Google Developers Blog: Modernizing OAuth interactions in Native Apps for Better Usability and Security]]
([TIME[2017-01-19 06:26:40 +09:00]])
<https://developers.googleblog.com/2016/08/modernizing-oauth-interactions-in-native-apps.html>
]FIGCAPTION]

> The rollout schedule for the deprecation of web-views for OAuth requests to Google is as follows. Starting October 20, 2016, we will prevent new OAuth clients from using web-views on platforms with a viable alternative, and will phase in user-facing notices for existing OAuth clients. On April 20, 2017, we will start blocking OAuth requests using web-views for all OAuth clients on platforms where viable alternatives exist.

]FIG]

[79] [CITE@ja[WebView Class (Windows)]]
([TIME[2017-03-16 12:47:02 +09:00]])
<https://msdn.microsoft.com/ja-jp/library/windows/apps/windows.ui.xaml.controls.webview>

[FIG(quote)[
[FIGCAPTION[
[90] [CITE[Lotus Notes 8 ヘルプ - MIME メールに対して埋め込みブラウザを無効にするには]]
([TIME[2017-03-17 18:11:07 +09:00]])
<https://www.bcom.co.jp/help/help8_client.nsf/2e73cbb2141acefa85256b8700688cea/b95ac577e9412cbc4925732400351164!OpenDocument>
]FIGCAPTION]

> デフォルトでは、IBM Lotus Notes はシステムブラウザを使用して MIME メールを表示します。この場合、Lotus Notes のデフォルトブラウザと比べてメールの表示状態はよくなりますが、Lotus Notes のデフォルトブラウザのような正確な印刷やメールヘッダーの表示を行うことはできません。また、システムブラウザを使用することにより、セキュリティの問題が発生する可能性もあります。

]FIG]

[FIG(quote)[
[FIGCAPTION[
[100] [CITE@ja[【はてなからの回答】はてなブログの iPhoneアプリで勝手にログアウトされる問題について - いつもマイナーチェンジ!]]
( ([TIME[2017-05-29 02:01:19 +09:00]]))
<http://www.mayoinu.com/entry/2015/10/23/200000>
]FIGCAPTION]

> SafariのCookieをブロックしている場合、はてなブログアプリでもログインが続かない状態になってしまうことを確認いたしております。
> Cookieの設定を「常に許可」、もしくは「訪問したWebサイトを許可」にした後、はてなブログアプリでログインし直して表示をご確認ください。

]FIG]

[104] [CITE@ja[Internet Explorerのアドレスバーに入力した内容をWebページが読み取れるバグ | スラド セキュリティ]]
([TIME[2017-10-01 20:16:26 +09:00]])
<https://security.srad.jp/story/17/09/30/1832253/>

[108] [CITE@ja[WKWebView で target = _blank と POST の組み合わせ注意 - star__hoshi's diary]]
([TIME[2018-03-04 15:33:38 +09:00]])
<http://starhoshi.hatenablog.com/entry/2017/01/06/WKWebView_%E3%81%A7_target_%3D__blank_%E3%81%A8_POST_%E3%81%AE%E7%B5%84%E3%81%BF%E5%90%88%E3%82%8F%E3%81%9B%E6%B3%A8%E6%84%8F>

[118] [CITE@ja[【???】スマホゲーム「アイドルマスターミリオンライブ!シアターデイズ」では阿部寛のHPが見れるらしい - Togetter]]
([TIME[2020-10-12T00:31:44.000Z]])
<https://togetter.com/li/1606720>

[142] [CITE@ja[抜け道もあるが、無意味ではない スマホの青少年向けフィルタリング、「される側」はどうしてる? | i:Engineer(アイエンジニア)|パーソルクロステクノロジー]], [TIME[2023-08-02T05:52:17.000Z]] <https://staff.persol-xtech.co.jp/i-engineer/product/SPfilter>

>鈴木さん:ただ、これはスマートフォンの標準ブラウザに関しての話なので、[B[アプリ内のブラウザは対象外になります]]。ですので、例えば「LINEで回ってきたURLを、アプリ内のブラウザで開けてしまう」という弱点があるんですよ。……というかそもそも、LINEも利用推奨年齢が12歳以上のアプリではあるんですけどね。

[143] [CITE@ja[長岡りみやさんはTwitterを使っています: 「ANAアプリからJAL航空券を予約する方法 ①ANAアプリで「運航の見通し」を開く ②ANAウェブサイトのトップページに移動し、サイト内検索で「植物防疫所」を検索 ③「植物検疫からの重要なお知らせ|ANA」を開き、「農林水産省 植物防疫所のウェブサイト」と書かれたリンクを開く」 / X]], [TIME[午前2:23 · 2023年8月4日][2023-08-03T17:23:32.000Z]], [TIME[2023-08-05T03:29:43.000Z]] <https://twitter.com/nagaok_arimiya/status/1687152231580368896>

- [82] [CITE@ja[2021年版 主要なアプリ内ブラウザのUserAgentを調べてみた & 判定を実装してみた]], [TIME[2025-02-21T05:18:10.000Z]] <https://zenn.dev/kecy/articles/f51851e42c4243>

[84] >>82 は不完全 (標準的なWebブラウザーと挙動が違うのに判定手段を用意しない糞アプリが悪いのだが)

- [81] [CITE@en[GitHub - andy-isd/ios-inapp-detection-js: This script detects if your webpage was opens in Safari or In-App utilizing window.innerHeight property.]], [TIME[2025-02-21T05:17:37.000Z]] <https://github.com/andy-isd/ios-inapp-detection-js>
- [83] [CITE@uk-UK[Safari In-App detection]], [TIME[2025-02-21T05:38:06.000Z]] <https://andy.isd-group.com/inapp.php>

[85] >>83 [[iPhone]] の画面サイズと比較するという力技、確かにこうでもするしかないのが辛いところ。
>>81 で自由ソフトウェアで配布されている。

Historical Legal Sensitive Parent: [Help / License]

Edit

Page

Page name(s)