Railsで URL Shortenerを作ってみた (1/3)

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を実際に生成してデータベースに登録する処理を追加すれば、登録部分は完成。

続く。