Railsの勉強記録。
仕事で社内の情報をTracなど Webベースのアプリケーションで扱うようになって、それらのURLを示すのに短縮URLを使えるといいんだけど bit.lyなど外部サービスを使うのはちょっとアレだよね、ということで URL Shortenerを作ってみることにした。ベースはRails 2.2.2。
仕様の検討
要求事項としては、
- 画面は登録を行うための 1ページだけ
- http://hoge.local/s/XXXXXX などにアクセスすると、登録したページにリダイレクトする
といったところ。
まずモデルについて考えてみる。URLと短縮名のペアを管理するモデルがまず必要。それを Urlpairと名付ける。ユーザー認証などは今のところ必要ないし、今のところはこれ一つだけでいいだろう。
リダイレクトの仕組みはルーティングを工夫すれば何とかできそうだし、登録作業を1ページで済ますにはAJAXを使えばいい。
というわけで作ってみる。まずは登録画面のひな形。
プロジェクト作成
プロジェクト名は SURL。
rails _2.2.2_ SURL -d sqlite3
scaffoldで UrlpairのCreate/Read/Update/Deleteを行うひな形を作ってしまう。実際にはメソッドの大半は必要ないので後から削る。urlは登録するURL、surlはその短縮形。
./script/generate scaffold urlpair url:string surl:string rake db:migrate
ここで一旦動かしてみる。
./script/server
今回目的とするアプリにリスト表示は必要ないし、new画面の中にある surlは手入力させるものでないので削除していい。というわけで、SURL/app/views/urlpairs以下のファイルをいじる。
- edit.html.erb ・・・いらないので削除
- index.html.erb ・・・いらないので削除
- new.html.erb ・・・index.html.erbにリネーム
- show.html.erb ・・・いらないので削除
次に index.html.erbにリネームした元 new.html.erbを編集する。不要な surlのフィールドや他画面へ遷移するリンクを取り除く。id="shorturl"のdivは短縮URLの結果が入るところ。submitボタンをクリックしたら短縮URLを生成して shorturlの所に結果を表示するため、フォームはform_remote_forを使い、submitされたらコントローラの createを呼ぶようにする。
<h1>Simple URL Shortner</h1> <% form_remote_for :urlpair, :url=>{:action => 'create'} do |f| %> <p> <%= f.label :url %><br /> <%= f.text_field :url %> </p> <p> <%= f.submit "Create" %> </p> <% end %> <div id="shorturl">?????</div>
これがちゃんと動くようにするために、次はコントローラ SURL/app/controllers/urlpairs_controller.rb を編集する。ここはばっさり削る。show, edit, update, destroy, newは削除。createは短縮URLを生成する部分にするが、今はその実装は後回し。ファイル全体は以下の通り。
class UrlpairsController < ApplicationController def index @urlpair = Urlpair.new end def create end end
次に createの処理後に出力を行う部分。今回はRJSを使うことにし、SURL/app/views/urlpairs/create.rjsを以下のように書く。shortURLには短縮されたURLが入るが、いまは適当に。
shortURL = "http://www.yahoo.co.jp/" page[:shorturl].replace_html("<a href=\"#{shortURL}\">#{shortURL}</a>") page[:shorturl].highlight page[:shorturl].select();
最後にレイアウトファイルの中で標準の javscriptを読みこむようにする。SURL/app/views/layouts/urlpairs.html.erbを開き、 headの中に以下の行を追加。
<%= javascript_include_tag :defaults %>
第0版はこれで完成。サーバを動かしてフォームに適当な文字列を入れて(入れなくてもいいけど) Createボタンを押してみる。
短縮URLを実際に生成してデータベースに登録する処理を追加すれば、登録部分は完成。
続く。