jpmobileを用いた位置情報取得アプリケーションの作成

2006-10-30

http://jpmobile.rubyforge.org

概要

jpmobileの使い方を紹介するため、簡単な携帯電話向けアプリケーションを書いてみようと思います。

例として

PCからのアクセスの場合は、携帯電話でアクセスするようメッセージを表示する。

携帯電話からのアクセスの場合は、

<ul>
	<li> 位置情報(DoCoMo オープンiエリア含まず)を取得するためのリンクを表示する。</li>
	<li> 位置情報(DoCoMo オープンiエリア含まず)が送出された場合はそれを表示する。</li>
</ul>
</li>

というものを作ります。

Railsアプリケーションの準備

アプリケーションtestappを作成し、プラグインをセットアップします。

dara@basil:~$ rails testapp
dara@basil:~$ cd testapp
dara@basil:~/testapp$ ./script/plugin install svn://rubyforge.org/var/svn/jpmobile/trunk/jpmobile

controllerの作成

今回はPcControllerとMobileControllerを用意し、リダイレクトで切り替えることにします。

まずコントローラを生成します。

dara@basil:~/testapp$ ./script/generate controller pc index
dara@basil:~/testapp$ ./script/generate controller mobile index

routesの設定など

トップページはPcControllerで受けることにしましょう。routes.rbを編集します。たとえば

dara@basil:~/testapp$ emacs config/routes.rb

として、

  # You can have the root of your site routed by hooking up '' 
  # -- just remember to delete public/index.html.
  # map.connect '', :controller => "welcome"
  map.connect '', :controller => "pc"  # この行追加

のように最後の一行を追加します。

そして、index.htmlを削除します。

dara@basil:~/testapp$ rm public/index.html

PC側の実装

続いてPC側の実装を行います。

controller

携帯電話からのアクセスである場合はMobileControllerにリダイレクトすることにします。

dara@basil:~/testapp$ emacs app/controllers/pc_controller.rb

として

class PcController < ApplicationController
def index
redirect_to :controller=>“/mobile” if request.mobile?
end
end

と、PcController#indexに一行書き加えます。

view

次にPCからのアクセスの場合に表示されるviewを書きます。

dara@basil:~/testapp$ emacs app/views/pc/index.rhtml

として、以下のように書き込みます。

<h1>とりあえず携帯電話専用です</h1>
携帯電話で
<%=h url_for :controller=>“/mobile”, :only_path=>false %>
を開いてください。

携帯側の実装

今度は携帯側の実装を行います。

controller

dara@basil:~/testapp$ emacs app/controllers/mobile_controller.rb

として、indexメソッドの中身を書きます。

class MobileController < ApplicationController
def index
unless request.mobile?
redirect_to :controller=>“/pc”
else
@pos = request.mobile.position
@ident = request.mobile.ident
end
end
end

view

最後に、携帯viewを書きます。

dara@basil:~/testapp$ emacs app/views/mobile/index.rhtml

として、以下のように書き込みます。

<h1>ようこそ携帯電話</h1>
<% if @pos %>
<p>緯度: <%=h @pos.lat %>, 経度: <%=h @pos.lon %></p>
<% end %>
<% if @ident %>
<p>ident: <%=h @ident %></p>
<% end %>
<p>位置情報取得:<br/>
<%= get_position_link_to %></p>

完成

以上で完成です。PC、携帯電話からアクセスして試してみてください。うまく動いたでしょうか？

補足

controllerの切り替え方法について

今回はMobileController#indexの中でリダイレクトを設定しましたが、before_filterを使うと複数のactionについてリダイレクトを一度に設定できるので便利かもしれません。

class PcController < ApplicationController
  before_filter :redirect_for_mobile
private
def redirect_for_mobile
if request.mobile?
pa = params.dup
pa[:controller] = “/mobile”
redirect_to pa
end
end
end

文字コードについて

一部機種ではUTF-8のHTMLは正しく表示できないようです。after_filterを使うと、出力の段階で文字コードを変換できるので便利かもしれません。

class MobileController < ApplicationController
  after_filter :to_sjis
private
def to_sjis
@headers[“Content-Type”] = “text/html; charset=Shift_JIS”
response.body = response.body.tosjis
end
end