第2回　jpmobileはじめの一歩

設樂 洋爾

2009/2/23

携帯電話からのアクセスの場合にリダイレクトする

　もちろん、コントローラでrequest.mobile?を使用することもできます。携帯電話用に独自の作り込みが必要になる場合には、携帯電話とPCとを別のコントローラで処理するのがいいでしょう。

　次は、mobileコントローラを作成して、携帯電話からpcコントローラにアクセスがあった場合には、mobileコントローラにリダイレクトするようにしてみましょう。

% ./script/generate controller mobile index

　app/controllers/pc_controller.rbにフィルタを追加します。redirect_if_mobileを用意し、before_filterで指定します。

class PcController < ApplicationController
  before_filter :redirect_if_mobile # フィルタを追加
  def index
  end

  private
  def redirect_if_mobile
    redirect_to :controller => 'mobile' if request.mobile?
  end
end

　Webブラウザを開き、/pcにアクセスしてみましょう。通常の（PCの）User-AgentでアクセスするとPC用のビュー（Railsによって生成されたデフォルトのページ。Pc#indexというタイトル）が表示されます。

　一方、携帯電話のUser-Agentでアクセスすると、/pcから/mobileにリダイレクトされ、携帯電話用のビュー（Mobile#indexというタイトル）が表示されます。

　さらに、キャリアの判別が必要な場合もあると思います。このようなときは、

case request.mobile
when Jpmobile::Mobile::Docomo
  # for DoCoMo
when Jpmobile::Mobile::Au
  # for au
when Jpmobile::Mobile::Softbank
  # for SoftBank
when Jpmobile::Mobile::Willcom
  # for Willcom
when Jpmobile::Mobile::Emobile
  # for EMOBILE
else
  # for PC
end

とします。

　また、 特定のキャリアかどうかを判別する場合には、

if request.mobile.docomo?
  # for DoCoMo
end

と書くこともできます（ほかにau?、softbank?、willcom?、emobile?が使用できます）。

　さらに、テンプレートの中で分岐したい場合には、

<% if request.mobile.docomo? %>
  DoCoMoですね
<% end %>

とすることもできます。

携帯電話ビューへの自動振り分け

　先ほどは、コントローラをPC用と携帯電話用の2種類を用意して、切り替えていました。これは、PCと携帯電話で画面遷移が大きく異なるなど、コントローラを別々に用意する必要がある場合には有効です。

　しかし、PCと携帯でビューだけが異なるような場合には少々大げさです。このようなときには、ビューだけを簡単に切り替えることができるビューの自動振り分けを使ってみましょう。

　index.html.erbに対して、同じディレクトリにindex_mobile.html.erbを配置すると、携帯電話からのアクセスには自動的にindex_mobile.html.erbが使われるようになります。

　1つのHybridコントローラで両方のアクセスに対応してみましょう。まず、コントローラを作成します。

% ./script/generate controller hybrid index

　次に、app/views/hybrid/index_mobile.html.erbを作ってみましょう。例えば、

<h1>Mobile view</h1>

としてみます。これだけで携帯電話からのアクセスの場合だけ、こちらが表示されるようになります。PCの場合はそのまま、つまりRailsが生成したindex.html.erbが表示されるはずです。

　それぞれのWebブラウザで/hybridを表示して確認してみてください。

　このように、ページ遷移などがPC用と大きく変わらない場合には、テンプレートを別に用意するだけで表示を切り替えることができます。

　さらに、携帯電話のキャリアごとにテンプレートを切り替えることもできます。app/views/hybrid/index_mobile_docomo.html.erbを作成してみます。例えば、

<h1>DoCoMo view</h1>

とします。これで、ドコモ携帯からのアクセスの場合のみ、このテンプレートが利用されるようになります。ドコモ以外の携帯電話では、先ほどの携帯電話用テンプレート、app/views/hybrid/index_mobile.html.erbが使用されます。

　auやソフトバンクなどの携帯電話でも同様の手順となります。

　まとめると、indexに対するテンプレートは以下の順番で検索され、最初に見つかったものが使用されることになります。

  • PCの場合：index.html.erb
  • ドコモ携帯電話の場合：index_mobile_docomo.html.erb → index_mobile.html.erb → index.html.erb
  • au携帯電話の場合：index_mobile_au.html.erb → index_mobile.html.erb → index.html.erb
  • ソフトバンク携帯電話の場合：index_mobile_softbank.html.erb → index_mobile.html.erb → index.html.erb
  • ウィルコム携帯電話の場合：index_mobile_willcom.html.erb → index_mobile.html.erb → index.html.erb
2/3

Index
jpmobileはじめの一歩
  Page1
jpmobileをRailsに組み込んでみる
アクセス元が携帯電話かPCかを判定する
Page2
携帯電話からのアクセスの場合にリダイレクトする
携帯電話ビューへの自動振り分け
  Page3
ディスプレイ情報の取得
まとめ

jpmobileとRailsで楽しい携帯Web開発
　Ruby／Rails関連記事
プログラミングは人生だ
まつもと ゆきひろのコーディング天国　ときにプログラミングはスポーツであり、ときにプログラミングは創造である。楽しいプログラミングは人生をより実りあるものにしてくれる
生産性を向上させるRuby向け統合開発環境カタログ
Ruby on Rails 2.0も強力サポート　生産性が高いと評判のプログラミング言語「Ruby」。統合開発環境を整えることで、さらに効率的なプログラミングが可能になる
かんたんAjax開発をするためのRailsの基礎知識
Ruby on RailsのRJSでかんたんAjax開発（前編）　実はAjaxアプリケーション開発はあなたが思うよりも簡単です。まずはRuby on Railsの基礎知識から学びましょう
Praggerとnetpbmで作る画像→AA変換ツール
Rubyを使って何か面白いものを作ってみよう！　一般的な画像をアスキーアートに変換するツールを作ってみる。さらに出力にバリエーションを持たせてみよう
コードリーディングを始めよう
Railsコードリーディング〜scaffoldのその先へ〜（1）　優れたプログラマはコードを書くのと同じくらい、読みこなす。優れたコードを読むことで自身のスキルも上達するのだ
　　Coding Edgeフォーラムフィード　 2.0／1.0／0.91


Coding Edge フォーラム 新着記事
＠ITメールマガジン　新着情報やスタッフのコラムがメールで届きます（無料）

注目のテーマ

>

Coding Edge 記事ランキング

本日 月間
＠IT