8章 マルチデバイス配信

3. チャネル選択機能

複数のチャネルを作成し、それぞれのチャネルに対して最適なコンテンツを配信するところまできたら、マルチでバイス対応はあと一歩で完成します。あとは、サイトにアクセスしてきたユーザのデバイスを判別し、それに従って、ユーザを最適なチャネルに誘導すれば完成です。

チャネル選択機能は、ユーザが使用しているデバイス上のブラウザが提示する User-Agent から、そのデバイスが参照すべき「チャネル」を決定します。そして、そのデバイスからのアクセスをそのチャネルのコンテンツを配信している URL に誘導します。

WebRelease は静的コンテンツを公開サーバにアップロードしてコンテンツを公開するタイプの CMS であるため、ユーザのブラウザからのアクセスを適切なチャネルに振り分ける動作は、WebRelease 側で行われるのではなく、公開サーバ側で行われなければなりません。

WebRelease のチャネル選択機能は、振り分け機能の実現に apache の mod_rewrite を使用します。WebRelease が mod_rewrite 用の設定を自動生成し、それを、公開サーバ上の mod_rewrite に解釈実行させることで振り分け処理を実現します。チャネル選択機能を動作させるためには、公開サーバは mod_rewrite が使える apache である必要があります。

なお、apache 以外の Web サーバでも、mod_rewrite と同じか、非常に近い動作をするモジュールを持っているものがあります。そのような Web サーバも公開サーバとして利用できる可能性があります。

WebRelease が提供しているチャネル選択機能を使うことは必ずしも必須ではありません。デバイスを検出して適切なチャネルの URL に誘導する処理を、WebRelease の提供する機能とは別の、独自の mod_rewrite ルールで実装したり、クライアントサイドの JavaScript で実装することも可能です。

デバイス判定ルール

各種のデバイスに対して、そのデバイスに対してどのチャネルのコンテンツを提供するのが良いかを決めるルールをデバイス判定ルールと呼びます。デバイスからのアクセスは、ここで指定したデバイス判定ルールに従って適切なチャネルに誘導されます。

デバイス判定ルールは「FTP管理」画面の「ルール」タブ中にある「デバイス判定ルール」欄に指定します。

このデバイス判定ルールには、デフォルトでは以下の 4 つのルールが設定されています。実際の運用では、このルールをそのまま使うか、改良して使用してください。このルールは単純ですが、実用レベルで動作するでしょう。しかしながら、デバイスは急速にその種類を増して行くと想定されますので、判定ルールについては、随時メンテナンスを念頭において運用する必要があると言えます。

mobile iPhone iPod BlackBerry "Windows Phone" Android*Mobile
tablet iPad Android
keitai DoCoMo KDDI DDIPOCKET WILLCOM J-PHONE Vodafone SoftBank Up.Brwoser
modern "MSIE 9." "MSIE 10." "MSIE 11." Chrome Safari Firefox Opera

ルールは、下記の形式にしたがって記述します。

• 1 行に 1 ルールずつ記述します。複数のルール（デフォルトのデバイス判定ルールの場合は4つ)で1セットのデバイス判定ルールを構成します。
• ひとつのルールは、半角スペースで区切られた複数の単語から構成されます。
• 各ルールの先頭の単語はチャネル名です。2 語め以降が User-Agent にマッチさせる照合パターンです。ひとつのルールは、複数の照合パターンを持つことができます。ルール中のいずれかの照合パターンが User-Agent とマッチすると、そのデバイスはルールの先頭に指定されているチャネルに誘導されます。
• 照合パターン中にスペースを含めたい場合には、照合パターン全体を " (ダブルクオート) で囲んでください。
• 照合パターン中に、任意の文字列とのマッチする部分を作りたい場合には、その部分を * で表現してください。
• 照合パターンと User-Agent のマッチングを行う場合には、大文字と小文字は区別されません。デフォルトで指定されているルールは大文字小文字の混ざった定義になっていますが、全部小文字でも同じ動作になります。
• ルールの順番は重要です。ブラウザの User-Agent が、ルール中のいずれかの照合パターンにマッチするかどうか、ルールが記述されている順に上から調べます。あるルール中の照合パターンとマッチしたら、そのブラウザはルールに指定されているチャネルに誘導されます。この場合、それ以降のルールはチェックされません。
• いずれのルールにもマッチしない User-Agent を持つデバイスに対は、プライマリチャネルに誘導されます。

ここからは、以下のルール

mobile iPhone iPod BlackBerry "Windows Phone" Android*Mobile

を例にして説明してみます。

• このルールは、先頭が mobile で始まっています。ですから、チャネル mobile に対するルールです。このルールにマッチする User-Agent を持つデバイス（ブラウザ）はチャネル mobile に誘導されます。
• このルールは「iPhone」「iPod」「BlackBerry」「"Windows Phone"」「Android*Mobile」という 5 つの照合パターンをもっています。
• ブラウザの User-Agent がこの 5 つの照合パターンのいずれかを含んでいる場合、そのブラウザには、チャネル mobile のコンテンツが提供されるべきであることを定めています。この「含んでいる」とは、User-Agent がそういう文字列を含んでいるということです。
• このルールの場合、照合パターン "Windows Phone" はパターン中にスペースを含んでいるので照合パターンがダブルクオートで囲まれています。この "Windows Phone" というパターンは Windows Phone を搭載する端末から送られてくる、例えば下記のような User-Agent の ... 9.0; Windows Phone OS 7.5... の部分にマッチします。
  
  Mozilla/5.0 (compatible; MSIE 9.0; Windows Phone OS 7.5; Trident/5.0; IEMobile/9.0; ....
  
  ダブルクオートに囲まれていないと、Windows と Phone が別々の独立した照合パターンとして扱われるため User-Agent 中に iPhone や WindowsXP などが含まれている場合にそれらとマッチしてしまいます。
• このルールの中の Android*Mobile というパターンは、Andoroid という単語に続いて、何かの、0 文字以上の文字列が続き、その後ろに Mobile という単語が出現する User-Agent とマッチします。例えば、Android 端末に搭載されている一般的なブラウザは、下記のような User-Agent を送ってきますが、この User-Agent の前半にある Android 部分と、後半にある Mobile の部分にマッチするように動作します。
  
  Mozilla/5.0 (Linux; U; Android 1.6; ja-jp; generic ....... Version/3.1.2 Mobile Safari/525.20.1

mod_rewrite 用ディレクティブの生成機能

WebRelease には、先に説明したデバイス判定ルールから mod_rewrite 用のディレクティブのセットを生成する機能があります。

生成されるディレクティブセットは、下記のとおり動作するものとなっています。

• プライマリチャネル以外のチャネルの URL へのリクエストに対しては、そのまリクエストされたチャネルのコンテンツを返します。この場合、User-Agent によるデバイスの判定、Query String、Cookie の参照は行いません。リクエストされたとおりにコンテンツを返します。この時、レスポンスには

  channel=<channelName>

  という Cookie がセットされます。

• プライマリチャネルの URL に対してリクエストがあり、そのリクエストが channel=<chanelName> という Query String を持っている場合、そのリクエストは <channelName> に指定されたチャネルの対応する URL にリダイレクトされます。この時、レスポンスには

  channel=<channelName>

  という Cookie がセットされます。

  channel=<channelName> という Query String を付けてプライマリチャネルにアクセスすれば、目的のチャネルにリダイレクトしてもらえます。
  
  例えば、プライマリチャネルの URL が

  https://www.example.com/

  の場合に

  https://www.example.com/about_us.html?channel=mobile

  というアクセスがあった場合、このリクエストはチャネル mobile の該当する URL、例えば、チャネル mobile がサブディレクトリ型チャネルでその URL が

  https://www.example.com/m/

  となっているとすると、

  https://www.example.com/m/about_us.html

  にリダイレクトされます。

• プライマリチャネルの URL に対してリクエストがあり、そのリクエストが channel=. という Query String を持っていた場合 User-Agent によるデバイス判定が行われます。リクエストは、判定の結果得られたチャネルの対応する URL にリダイレクトされます。この時、レスポンスには

  channel=<channelName> 

  という Cookie がセットされます。
  
  channel=. という Query String を付けてプライマリチャネルにアクセスすれば、デバイス判定を行った結果のチャネルにリダイレクトしてもらえます。

  例えば、プライマリチャネルの URL が

  https://www.example.com/

  で、サブディレクトリ型のチャネル tablet が定義されていてその URL が

  https://www.example.com/t/

  であるとします。この時、

  https://www.example.com/about_us.html?channel=.

  というアクセスがあると、リクエストに対して User-Agent によるチャネルの判定が実行されます。判定の結果、このデバイスをチャネル tablet に誘導する必要があると判断された場合、このリクエストは

  https://www.example.com/t/about_us.html

  にリダイレクトされます。

• プライマリチャネルの URL に対してリクエストがあり、そのリクエストが channel=<chanelName> という Cookie を持っている場合、そのリクエストを <channelName> に指定されたチャネルの対応する URL にリダイレクトします。この時、レスポンスには

  channel=<channelName>

  という Cookie が（再度)セットされます。

  クライアントサイドで、JavaScript を使ってデバイス判定を行った場合には、判定の結果をこの cookie に入れてからプライマリチャネルのURLを参照することで、判定結果に対応したチャネルの URL に誘導してもらえることになります。なお、対応するプライマリチャネル上のページの URL は Page オブジェクトの canonicalURL() メソッドで得ることができます。
  
  また、ユーザが特定のデバイス向けのコンテンツをページの U/I で選択した場合、例えば「PC 版を見る」をクリックして PC 版のコンテンツを閲覧することを選んだ場合なども、選択結果をこの cookie に入れてページの canonicalURL() にアクセスすることで、ユーザの選択したデバイス向けのチャネルに誘導してもらうことができます。

• 上記のいずれにも該当しないリクエストに対しては、User-Agent によるデバイス判定が行われます。リクエストは、判定の結果得られたチャネルの対応する URL にリダイレクトされます。この時、レスポンスには
  

  channel=<channelName>

  という Cookie がセットされます。
  
  判定の結果、User-Agent がいずれのルールの照合パターンともマッチしなかった場合は、リクエストに対してはプライマリチャネルのコンテンツが返されます。この場合には <channelName> の部分はプライマリチャネルの名前（デフォルトでは main) になります。プライマリチャネルの名称を変更している場合には、その変更後の名前が Cookie の値として使われます。

Cookie が設定される場合、いずれの場合も、セットされる Cookie の寿命は約 10年に指定されています。また、パスにはプライマリチャネルのドキュメントルートが指定されています。上記の説明のとおり、もし cookie を持ったデバイスがプライマリチャネルの URL にアクセスしてきた場合には、その cookie の値に応じたチャネルに誘導されます。この仕組みの応用として、クライアントサイドの JavaScript でデバイスを判定し、その判定結果を cookie に入れてからプライマリチャネル (Page オブジェクトの canonicalURL() メソッドで取得できます)にアクセスすることで、判定結果に対応したチャネルに誘導してもらえる、というのがあります。（なお、判定結果は cookie ではなく、query string にしてサーバ側に伝えるという方法も使えます）

デフォルトで指定されているデバイス判定ルールに対して生成される mod_rewrite ディレクティブセットは下記のとおりです。なお、このディレクティブセットは、mobile、tablet、keitai、modern という 4 つのサブディレクトリ型チャネルがあり、それらのサブディレクトリ指定がそれぞれ m、t、k、5 である場合のものです。

RewriteEngine On

RewriteRule	^k/.*$			- [L,CO=channel:keitai:%{HTTP_HOST}:5256000:/]
RewriteRule	^m/.*$			- [L,CO=channel:mobile:%{HTTP_HOST}:5256000:/]
RewriteRule	^5/.*$			- [L,CO=channel:modern:%{HTTP_HOST}:5256000:/]
RewriteRule	^t/.*$			- [L,CO=channel:tablet:%{HTTP_HOST}:5256000:/]

RewriteCond	%{QUERY_STRING}	"(^|&)channel=main(&|$)"
RewriteRule	^(.*)$			- [L,CO=channel:main:%{HTTP_HOST}:5256000:/]

RewriteCond	%{QUERY_STRING}	"(^|&)channel=keitai(&|$)"
RewriteRule	^(.*)$			/k/$1 [L,R]

RewriteCond	%{QUERY_STRING}	"(^|&)channel=mobile(&|$)"
RewriteRule	^(.*)$			/m/$1 [L,R]

RewriteCond	%{QUERY_STRING}	"(^|&)channel=modern(&|$)"
RewriteRule	^(.*)$			/5/$1 [L,R]

RewriteCond	%{QUERY_STRING}	"(^|&)channel=tablet(&|$)"
RewriteRule	^(.*)$			/t/$1 [L,R]

RewriteCond	%{QUERY_STRING}	"!(^|&)channel=.(&|$)"
RewriteCond	%{HTTP_COOKIE}	"(^| |;)channel=main($| |;)"
RewriteRule	^(.*)$			- [L,CO=channel:main:%{HTTP_HOST}:5256000:/]

RewriteCond	%{QUERY_STRING}	"!(^|&)channel=.(&|$)"
RewriteCond	%{HTTP_COOKIE}	"(^| |;)channel=keitai($| |;)"
RewriteRule	^(.*)$			/k/$1 [L,R]

RewriteCond	%{QUERY_STRING}	"!(^|&)channel=.(&|$)"
RewriteCond	%{HTTP_COOKIE}	"(^| |;)channel=mobile($| |;)"
RewriteRule	^(.*)$			/m/$1 [L,R]

RewriteCond	%{QUERY_STRING}	"!(^|&)channel=.(&|$)"
RewriteCond	%{HTTP_COOKIE}	"(^| |;)channel=modern($| |;)"
RewriteRule	^(.*)$			/5/$1 [L,R]

RewriteCond	%{QUERY_STRING}	"!(^|&)channel=.(&|$)"
RewriteCond	%{HTTP_COOKIE}	"(^| |;)channel=tablet($| |;)"
RewriteRule	^(.*)$			/t/$1 [L,R]

RewriteCond	%{HTTP_USER_AGENT}%	"\Qiphone\E|\Qipod\E|\Qblackberry\E|\Qwindows phone\E|\Qandroid\E.*\Qmobile\E" [NC]
RewriteRule	^(.*)$			/m/$1 [L,R]

RewriteCond	%{HTTP_USER_AGENT}%	"\Qipad\E|\Qandroid\E" [NC]
RewriteRule	^(.*)$			/t/$1 [L,R]

RewriteCond	%{HTTP_USER_AGENT}%	"\Qdocomo\E|\Qkddi\E|\Qddipocket\E|\Qwillcom\E|\Qj-phone\E|\Qvodafone\E|\Qsoftbank\E|\Qup.brwoser\E" [NC]
RewriteRule	^(.*)$			/k/$1 [L,R]

RewriteCond	%{HTTP_USER_AGENT}%	"\Qmsie 9.\E|\Qmsie 10.\E|\Qmsie 11.\E|\Qchrome\E|\Qsafari\E|\Qfirefox\E|\Qopera\E" [NC]
RewriteRule	^(.*)$			/5/$1 [L,R]

RewriteRule	^(.*)$			- [L,R,CO=channel:main:%{HTTP_HOST}:5256000:/]

mod_rewrite 用ディレクティブの自動アップロード

WebRelease  には、指定されたデバイス判定ルールにもとづいて、mod_rewrite 用のディレクティブを自動生成し、それを公開サーバにアップロードする機能があります。

「FTP 管理」画面の「ルール」タブにある「htaccess 自動生成」のチェックボックスを ON にすると、自動生成された mod_rewrite 用のディレクティブが公開サーバに、必要に応じて自動でアップロードされるようになります。htaccess ファイルのアップロード先は、プライマリチャネルのコンテンツがアップロードされるディレクトリの直下となります。そのファイル名は、デフォルトでは .htaccess ですが、他のファイル名にする必要があれば「htaccess ファイル名」欄で指定してください。

.htaccess がアップロードされるタイミングは FTP 実行時となります。また、前回アップロードした .htaccess と差分がない場合にはアップロードは行われません。

.htaccess 用 apache の設定

アップロードされた .htaccess が正しく apache に理解され、解釈実行されるためには、apache 側の設定も必要です。下記の設定を httpd.conf に追記してください。または、同等の設定をおこなってください。

.htaccess を apache に認識させる方法について、さらに不明な点は、apache のマニュアルを参照してください。

<Directory  DOCROOT>
  Options SymLinksIfOwnerMatch
  AllowOverride FileInfo
</Directory>

DOCROOT の部分には、プライマリチャネルのルートディレクトリを指定します。例えば

/var/www/html/

などです。 ここで指定するディレクトリは .htaccess がアップロードされるディレクトリと一致している必要があります。

.htaccess のアップロードを手作業で行う

これまで説明してきたたとおり、WebRelease にはデバイス判定ルールから mod_rewrite 用のディレクティブを生成し、それを .htaccess として公開サーバに自動アップロードする機能があります。

一方で .htaccess の中に、WebRelease に関するものだけでなく、認証やアクセス制限など、他の設定も入れたい場合があります。そのような場合にはWebRelease が自動生成した .htaccess をそのまま使うことはできませんので、自動生成した .htaccess をベースに、必要な設定を追加した .htaccess を作成し、それを手作業で公開サーバのルートディレクトリに置いてください。

WebRelease が生成した .htaccess は「FTP管理」画面の「ルール」タブにあるダウンロードボタンをクリックすることで手元の PC にダウンロードすることができます。