Rails画像投稿アプリをHerokuで動かすときの写真保存方法

Ruby on Railsを使ってアプリケーションを作って、いざ公開!というときHerokuを使うと、一時的にしか画像が表示できないのでアプリケーションとしてしっかりと役割を果たしてくれません。Heroku以外で外部に画像を保存できるように設定しなければなりません。

Herokuと合わせて使える画像保存サービスはいろいろあり、Amazon awsのS3や cloudinaryなどがあります。今回はHerokuで簡単に設定できる cloudinaryを使っていきます。ちなみにどちらも、フリープランであってもクレジットカードの登録が必要なのであらかじめご了承ください。Herokuにアップしてあるアプリケーションで画像を扱えるようにしたいという趣旨の内容なので、前提として

・すでにRuby on Rails でアプリケーションを作り終わってHeroku上に公開していること

・画像のアップがローカルですでにうまくいっている状態であること。(今回はcarrierwaveを使って画像のアップロードをしています。)

を前提にしています。

cloudinaryを適応しよう

Herokuに公開している自分のアプリケーションに、画像保存用のクラウドサービス「 cloudinary」を適応させる方法はいくつかあります。今回はHeroku上で行おうと思います。

まず下記のURLにアクセスします。

https://elements.heroku.com/addons/cloudinary

そうするとcloudinaryのページに行きます。下にスクロールすると写真のようなボタンが現れます。

商業目的でないアプリケーションなら、フリープランで十分です。フリープランになっていることを確認したら、インストールボタンを押してください。フリープランでいいか、どのアプリに使うのかなど聞かれるので選択してください。これでアプリケーションに適応されました。

 

Herokuにデプロイしたアプリケーションを開いてください。

cloudinaryが追加されているのがわかるかと思います。追加されたアイコンをクリックすると、cloudinaryのページが開きます。初めて使うときにこのページを開くと、どの言語を使うか選択するようになっているのでRuby on Railsを選びましょう。

Rubyを選ぶとこういった画面に飛びます。

スクロールしていくと、

ファイルをダウンロードできるリンクがあるので、そこからファイルをダウンロード。configのところにcloudinary.ymlというファイルを作り、ダウンロードした内容をコピペしましょう。

 

ローカルでの操作

それではアプリケーションそのものの設定をしていきます。アプリケーションのGemfileを開いて gem ‘cloudinary’と書きましょう。いつものようにbundle installしてください。

これでgitにプッシュすればHerokuでも写真が保存できるアプリケーションの出来上がりです。