ASP.NET でタブレット以外を判別する方法と Display Mode への応用

もう Facebook では 1 年の振り返りが始まっている今日この頃、いかがお過ごしでしょうか。世間では Advent Calendar のタスキ繋ぎが全力で行われていますが、初日でその役目を終えた私はのんびりと過ごしています。

とか、書くと本気で本気で刺されそうなので、今日は小ネタとして ASP.NET でタブレットだけを判別する方法を書きます。*1

ASP.NET では現在のリクエストがモバイルデバイスからであることを判別する時、大体は以下のように書きます。

// モバイルデバイスの時に処理を行いたい
if (Request.Browser.IsMobileDevice)
{
    // なんかやる！
}

このプロパティは割と新しくて .NET 3.5 から追加されたようです。仕組みとしては ASP.NET が内部で持っているブラウザ情報ファイルを参照していて、iPhone や iPad、そして Android など割と一緒くたにして判別できます。

ちなみに ASP.NET MVC / Web Pages のブラウザオーバーライドを使っている場合には、以下のように値を取得すれば OK です。

// HttpContext は Controller が持っているプロパティを想定
if (HttpContext.GetOverriddenBrowser().IsMobileDevice)
{
    // なんかやる！
}

しかし、世の中にはタブレットは画面が大きいので、PC と同じデザインで表示したくなる時があります。

なので、タブレットを除いてスマートフォンだけを判別するコードを書いてみました。

public static bool IsPhoneDevice(this HttpRequestBase request)
{
    // 出直して来い
    if (request == null)
    {
        return false;
    }

    // IsMobileDevice が false の時は絶対に違う
    if (!request.Browser.IsMobileDevice)
    {
        return false;
    }

    var userAgent = request.UserAgent;

    // UserAgent が null の時はあるので注意
    if (string.IsNullOrEmpty(userAgent))
    {
        return false;
    }

    // iPhone もしくは、Android と Mobile を同時に含む時はスマートフォン
    return userAgent.Contains("iPhone") || (userAgent.Contains("Android") && userAgent.Contains("Mobile"));
}

iPad は UA に iPad と含まれるので簡単なんですが、Android タブレットの場合は Mobile が含まれるかどうかで判別できます。ぶっちゃけ ASP.NET はあんまり関係なかったですね。

とまあ、これでタブレットを除いて判別が出来るようになったので、今度は Display Mode でこの値を使って切り替えるようにしてみます。Display Mode の設定は DisplayModeProvider クラスを使って行います。

protected void Application_Start()
{
    // 予め追加されている設定を削除
    DisplayModeProvider.Instance.Modes.Clear();

    // 作成した拡張メソッドを使うように修正
    DisplayModeProvider.Instance.Modes.Add(new DefaultDisplayMode("Mobile")
    {
        ContextCondition = context => context.Request.IsPhoneDevice()
    });

    // それ以外の時のために追加しておかないといけない
    DisplayModeProvider.Instance.Modes.Add(new DefaultDisplayMode());
}

これで Index.Mobile.cshtml というファイル名でビューを定義しておけば、スマートフォンの時だけそのビューが表示されるようになります。タブレットの時には PC 用の Index.cshtml が表示されます。

割とニッチな感じですが、たまに必要になる時もあると思うので、頭の片隅にでもどうぞ。

*1:ただし Windows タブレットは全力で除く