2014 年 4 月 15 日

VagrantでモバイルWebアプリ開発環境を作る

実機を使ってモバイルWebアプリを開発するとき、WiFiから開発アプリに接続できるようにしておくと便利です。Vagrantを使えば、LANに接続するゲストOSの構築が簡単にできます。

今回のゲストOSはcentos64とし、社内のアクセスポイントに接続し、DHCPで社内LANのIPアドレスを付与します。DHCPを使うと、ホストOSとのファイル共有にNFSが利用できないので、Vagrant1.5から利用可能となったrsyncを使っています。固定IPも設定できるようですが、今回は割愛します。

環境

  • MacOSX 10.8.5(host)
  • Vagrant 1.5.1
  • Chef 11.10.4

Vagrantfile

config.vm.networkの:bridgeを指定してやると、ブリッジ選択のプロンプトなしで起動します。これはそれぞれの開発環境で異なるので、最初は:bridgeなしで起動するとよいでしょう。vagrant-omnibusプラグインでchefをインストールするようにしています。

VAGRANTFILE_API_VERSION = "2"

Vagrant.configure(VAGRANTFILE_API_VERSION) do |config|

  config.vm.box = "centos64"
  config.vm.network "public_network", :bridge => 'en1: Wi-Fi (AirPort)'
  config.vm.synced_folder "../src", "/usr/share/nginx/html/hoge", type: "rsync"
  config.omnibus.chef_version = :latest

end

rsyncによる同期は、以下のコマンドを実行しておきます。

$ vagrant rsync-auto &

nginxのレシピ

Webサーバはnginxを使っています。自分でレシピを書いてもいいですが、berkshelfでopscode-cookbooksからダウンロードします。

Berksfile

site :opscode
cookbook 'nginx'

iptablesの無効化

centosのiptablesを無効化しておかないとnginxへリーチしないので、自分でレシピを書いてsite-cookbooksに追加します。

site-cookbooks/iptables/recipes/default.rb

service 'iptables' do
  action [:disable, :stop]
end

nginxのmime.typesを置き換える

opscode-cookbooksのnginxのレシピでは、mime.typesにjsonが含まれていないので、ここだけ自分でレシピを追加しました。元々、このレシピにはjsonを含むmime.typesが含まれているのですが、それが反映されていないようです。

site-cookbooks/dev/recipes/default.rb

cookbook_file 'mime.types' do
  path   "#{node['nginx']['dir']}/mime.types"
  source 'mime.types'
  owner  'root'
  group  'root'
  mode   '0644'
  notifies :reload, 'service[nginx]'
end

これでモバイルWebアプリの開発環境が構築できました。今回はiOSのWebアプリのフロントエンド開発に利用しています。クライアントは実機とSafariのWebインスペクタを使って、デバッグ/テストしています。

ただ、DHCPなんで、たまにアドレスが変わってしまうことがあり、不便です。名前解決できる手段があればいいのですけどね。