MENU
  1. ホーム
  2. PHP
  3. アプリ内ブラウザ対策

アプリ内ブラウザ対策

PHP

ブログの更新を1年以上ご無沙汰していましたが、自分のプロダクトと格闘して得た知見のあれこれを、またこちらのブログに残していきたいと思います。

とりあえず忘れないうちにということで、
今回はWebアプリのアプリ内ブラウザ対策のお話し。2025年8月時点。

目次

背景

現在、私の運営している「My Oshi Info」というWebアプリを世の皆さまに知ってもらい、使ってもらうという活動を少しずつ頑張っているのですが、その中で公式LINE経由でURLをお伝えした方からGoogleログインをすると「画面が真っ白になった」という申告がありました。

自分のスマホ（iPhone）では発生しておらず、周囲のAndroidの方などにも試してもらっても再現しない。
検証の協力もお願いしたのですが、知り合いとかではなく、アンケートに協力いただいた方で関係性もないこともあり、デジタル苦手なので、、とお断りされてしまいました。

そんな中ジーズ同期から、iPadでSlackのアプリ内ブラウザで開いてGoogleログインすると真っ白になったと連絡が！

うわーそれじゃん！アプリ内ブラウザが怪しい！

現在、SNSでプロモーション活動を進めているので、プロフィールや概要欄に記載したURLから飛んでもらうと、基本的にアプリ内ブラウザが開いてしまう。せっかくSNS頑張って知ってもらってもログインして画面が白になってはどうしようもないので、これは早急に対策を打たねばならん！！

ということで対策を色々調べて見ることにしました。

（あと調べて見ると、セキュリティ面でも、アプリ内ブラウザでログインさせるのはよくなさそうでした）

対策を考える

アプリ内ブラウザでGoogle検索しても、自分のスマホの設定の話だったり、スマホアプリの話だったりして難航。
ということでChat GPTさんとご相談。

当初は、アプリ内ブラウザで自動的に外部ブラウザを立ち上げるようにできないかと思ったのですが、それは無理とわかり。（LINEのみURLの後ろに「/?openExternalBrowser=1」をつければ外部ブラウザで開く）

ということで決定した対策は以下の通り。

  1. トップページのPHPの処理の最初で、User Agentを取得し、そこに含まれるキーワードで、アプリ内ブラウザかどうかを判定する
  2. 「1」でアプリ内ブラウザと判定した場合は、専用のページにリダイレクトし、その画面上で「外部ブラウザで開いてください」という内容を表示する
    （アプリ内ブラウザではないと判定した場合は、そのままトップページを表示）
  3. 「2」の専用ページが表示された状態で「外部ブラウザーで開く」を押すと、その専用ページが開いてしまうので、専用ページ上でもアプリ内ブラウザ判定を行い、アプリ内ブラウザではないと判定されたら、トップページにリダイレクト

実装案

こちらを踏まえて、ChatGPTさんとご相談の上、①②部分の実装のコードは以下の内容にしました。
③はこれのアレンジでいけるので省略です。
特にUser Agent名の抽出はお任せして、どう考えても不要なものは削ってあります。

<?php

// UAに含まれる「アプリ内ブラウザのキーワード」一覧
$inAppKeywords = [
    // SNS系
    'Line', 'Instagram', 'FB_IAB', 'FBAN', 'FBAV', 'Facebook', 'Twitter', 'X-Twitter', 'Twi', 'Threads', 'TikTok',
    // コミュニケーション系
    'Slack', 'Discord',
    // その他（アプリ内ブラウザによくあるキーワード）
    'wv', 'WebView', 'InAppBrowser'
];

$userAgent = $_SERVER['HTTP_USER_AGENT'] ?? '';
$isInApp = false;

foreach ($inAppKeywords as $keyword) {
    if (stripos($userAgent, $keyword) !== false) {
        $isInApp = true;
        break;
    }
}

// アプリ内ブラウザの場合、専用ページへリダイレクト（※ページ名はダミーです）
if ($isInApp)) {
    header('Location: extrapage.php');
    exit;
}

--- 以下略 ---

動作検証（iPhone使用）

この記述でテストページを作成して検証しました。
動作確認は手元にiPhoneしかないのでiPhoneでやってます。（早々にAndroid検証端末買わないと…）

LINE・Instagram

正常に「アプリ内ブラウザ」判定して専用ページにリダイレクトされ、外部ブラウザーで開いたらトップページに遷移しました。OK！

X・Slack

「アプリ内ブラウザ」判定されず。ただ、User Agentの表記が、Safariで開いた時と完全一致していて、ログイン動作的にも問題なさそうなので、これはこれで一旦保留。（iPhone上はおそらくOK）

YouTube

そもそもYouTubeアプリからURLクリックしても外部ブラウザが立ち上がるので問題なかった。OK！

TikTok

私が法人ではなくビジネスアカウント作れないため、そもそもURLが貼れないので未検証。
ただ、URL貼れない＝アプリ内ブラウザ問題も存在せず当面OK！

と、ここまで一旦OKという感じですが、問題だったのがThreads。

Threads

「アプリ内ブラウザ判定されない」上に、XやSlackと異なり、Safariではない全然別のAgentで、Threadsの表記もない。

実は元々Threadsのアプリ内ブラウザで開くと「Googleログイン」ボタンが表示されない不具合もあったのと、今Threadsのインプレッションが結構高いので、ここは絶対「アプリ内ブラウザ判定」してもらう必要がありました。

ThreadsのUser Agentとは

ここはググってもChatGPTと相談しても見当たらずだったので、自分でThreadsのアプリ内ブラウザで開いて、そのUser Agentを取得した感じは「Barcelona」をキーワードにすると良さそうかなと思いつつ（他に新しいワードがない）、一応Chat GPT氏にも相談して見ると同じでした。

ちなみに「Threads Barcelona」で検索すると、「Barcelona」が「Threads」の昔のプロジェクト名だそうで。なるほど。元のコードには「Threads」も入れてあるので変わっても対応できそうなので、「Barcelona」を追加。

無事Threadsについてもリダイレクト成功しました！！良かった！！

推し活の情報収集を簡単にするWebアプリ「My Oshi Info」運営しています。
現在は、関東エリアのテレビ・ラジオ、お笑い情報に対応していますが拡大予定。よろしければどうぞ。
https://myoshiinfo.com/

PHP

関連記事

目次