ASP.NET MVC で DisplayModeをカスタムして使う

技術的なの初投稿です。ブログとかも含めてマジ初めて(;^ω^)
今更ネタですが・・・・・・

ASP.NET MVCの機能のDisplayModeを使うことで XXXXX.cshtml XXXXX.YY.cshtmlというViewを用意してクライアントによって使用するViewを使い分けるという機能があります。

使いどころとしてはPC用のサイトとスマホ用のサイトがほぼ同機能で見た目だけ切り替われば良いような時に役に立ちます。

詳しくは[しばやんさんのブログ](http://blog.shibayan.jp/entry/20110915/1316097030)に書いてあったと思います。

ただ標準の状態では、例えばモバイルデバイスでもユーザが選択してPCサイトを見る様な機能が欲しい時にうまく対応できません。

ブラウザの機能でPCサイトを表示するとか選択すればいいじゃん
といいたい時はありますが納得してもらえない時は多いのです(;・∀・)

レスポンシブデザインにすればいいじゃん
そんなデザイン費用は予算に含まれていないのです(;・∀・)

というときに以下のクラスを使ったりします。

```csharp:
    /// <summary>
    /// デバイス管理クラス
    /// </summary>
    public class DeviceManager
    {
        public const string DEVICE_COOKIEKEY = "Device_CookieKey";

        public static class DEVICE_COOKIEVAL
        {
            public const string PC = "PC";
            public const string MOBILE = "MOBILE";
        }

        /// <summary>
        /// PC設定を行います。
        /// </summary>
        /// <param name="Response">レスポンスクラス</param>
        public static void SetPC(HttpResponseBase Response)
        {
            Response.Cookies.Add(new System.Web.HttpCookie(name: DEVICE_COOKIEKEY, value: DEVICE_COOKIEVAL.PC) { Expires = DateTime.Now.AddYears(100) }); 
        }
        /// <summary>
        /// モバイル設定を行います。
        /// </summary>
        /// <param name="Response"></param>
        public static void SetMobile(HttpResponseBase Response)
        {
            Response.Cookies.Add(new System.Web.HttpCookie(name: DEVICE_COOKIEKEY, value: DEVICE_COOKIEVAL.MOBILE) { Expires = DateTime.Now.AddYears(100) }); 
        }

        /// <summary>
        /// モバイル設定ディスプレイモードクラス
        /// </summary>
        public class MobileDisplayMode : DefaultDisplayMode
        {
            /// <summary>
            /// コンストラクタ
            /// </summary>
            public MobileDisplayMode()
                : base("SP")
            {
                base.ContextCondition = context =>
                {
                    if (context.Request.Cookies[DEVICE_COOKIEKEY] != null)
                    {
                        var device = context.Request.Cookies[DEVICE_COOKIEKEY].Value;
                        if (device == DEVICE_COOKIEVAL.MOBILE) { return true; }
                        else if (device == DEVICE_COOKIEVAL.PC) { return false; }
                    }

                    var result = 
                        context.GetOverriddenBrowser().IsMobileDevice 
                        || 
                        (
                            (context.Request.UserAgent.IndexOf("Mobile", System.StringComparison.OrdinalIgnoreCase) >= 0)
                            &&
                            (context.Request.UserAgent.IndexOf("Android", System.StringComparison.OrdinalIgnoreCase) >= 0)
                        );

                    if (result) {
                        SetMobile(context.Response);
                    }
                    else {
                        SetPC(context.Response);
                    }

                    return result;
                };
            }
        }
    }
```

細かいところはあんまり見ないでください( ;∀;)

要するに初回アクセスならモバイルなのかPCなのかはIsMobileDeviceを使って確認します。
それでCookieにデバイス設定を埋め込みます。
次回アクセス以降にはCookieにデバイス設定が埋め込まれているので、そちらを参照してPCかMobileかを判定します。

ActionなどからSetPCとかSetMobileを呼び出して切り替えを行います。
呼び出しのAction中にSet関数にて切り替えを行っても、その処理内では切り替わりませんので
画面側からAjaxで切り替えActionを実行してlocation.reload()するみたいな処理をしていたかと思います。

IsMobileDeviceの判定部でOR条件にてUserAgentを確認しているのは、このクラスを作ったその昔、IsMobileDeviceがAndroidに対応していなかったからです。
今はどうなのか確認していません。

おしまい|дﾟ)