はじめに

Cloud9でRailsのAPIサーバの開発環境を構築する手順の忘備録になります．

次のような方におすすめです．

Cloud9にRailsのAPIサーバを構築したい
React+RailsやVue+Railsの開発環境が欲しい
Herokuなどの他のサービスを通さずにアプリを公開したい

なぜ書いたのか

RailsのみならCloud9のプレビュー機能が使えます．（参考サイト）
ただ，プレビューはあくまでもプレビューであり，ネットに公開されているわけではありません．
そしてAPIサーバは外部からアクセスできる必要があり，プレビュー機能では開発環境の役目を果たすことができません．

そこで，Cloud9上でネット公開されるRailsのAPIサーバの構築を試みました．
他に同様の記事が無く苦戦したので忘備録として残しておきます．

基本的な流れだけのせて，他の記事をリンクを載せて端折らせていただきます．

Cloud9の環境構築

AWSのアカウントを作成します．
そして，安全に操作できるようにユーザを作成し，Cloud9の環境を構築します．
初めてのAWS Cloud9導入

Rails APIサーバのセットアップ

rvmなりrbenvなりでRubyのバージョンを指定し，Railsをインストールします．

# rvmの場合．(rvmはデフォルトで入ってる)
rvm install "rubyのバージョン"
rvm use "rubyのバージョン"

gem install rails -v "railsのバージョン"

RailsアプリをAPIモードで作成します．

rails new "アプリ名" --api

CORSの設定

他のオリジンからアクセスを許可するために，コメントアウトを外してあげます．
そして，originsに，フロントのオリジンを指定します．

config/initializers/cors.rb

# 'rails new'の直後はコメントアウトされてる
Rails.application.config.middleware.insert_before 0, Rack::Cors do
  allow do
    origins 'hoge.fuga.example.com' #ここをフロントのオリジンに変える
    resource '*',
      headers: :any,
      methods: [:get, :post, :put, :patch, :delete, :options, :head]
  end
end

また，rack-corsがGemfileでコメントアウトされているので外します．

gem 'rack-cors'

gemを追加したので，インストールします．

bundle install

ネットワークの指定

Cloud9が動いているEC2インスタンスへは初期設定ではインターネットからアクセス出来ません．
そのため，「AWS 実行中のアプリケーションをインターネット経由で共有する」に従って，EC2にアクセス出来るようにします．

アカウントを作成したばかりなら，必須なのはセキュリティグループの設定ぐらいだと思います．
書いてありますが，ポート番号は8080~8082のどれかです．

Railsの起動

railsを起動します．
バインドとさきほどのポート番号を指定します．

rails s -p "ポート番号" -b 0.0.0.0

ブラウザで表示

「ネットワークの指定」の手順で実行した

curl http://169.254.169.254/latest/meta-data/public-ipv4

で得られるIPアドレスにポート番号をくっつけてブラウザで表示します．(例: 256.1.2.3:8081)

すると，いつもの画面が出てくるはずです．

これはブラウザで表示していますが，APIモードで動いているはずです．

終わりに

かなり省略しましたが，大まかな流れは合ってると思います．

ネットワークの設定までは順調だったのですが，バインドのところでつまずきました．
Cloud9だとポートやバインドは指定せずとも動くので甘えてました．

以上の手順で，最大3つのアプリまで一つのインスタンス上でネット公開できます．
そのため，RailsとReactやVueなどを同時に公開することも可能です．

Rails+Reactで動くことを確認しました．
ぜひ，試してみてください．

Cloud9でRailsのAPIの開発環境を構築