Rails6.0で作る交流会サイトの作成ログ(3)

▼免責事項
本記事により発生した如何なる損害についても当方は責任をおいません。

前回は、会員登録機能、ログイン機能、イベント投稿機能を作りました。

さて、ここまでherokuへデプロイしていなかったので、デプロイして見ましょう。

画像のアップロードは、GCS(Google Cloud ServiceI)を使うことにします。

GCSのアカウント作成方法はこちらを参考にしてください。

では、GCSの設定をして行きましょう!

# config/environment/production.rb

~省略~
  config.active_storage.service = :google
~省略~

作成した、JSONファイルはルートディレクトリ(Gemfileとかあるディレクトリ)に入れておきます。私は、「gcs_keyfile.json」というファイル名で入れておきました。

では、作成したストレージへの設定を書きましょう。

# config/storage.yml
test:
 service: Disk
 root: <%= Rails.root.join("tmp/storage") %>

local:
 service: Disk
 root: <%= Rails.root.join("storage").to_path %>


# Remember not to checkin your GCS keyfile to a repository
google:
 service: GCS
 project: 作成したプロジェクト名
 credentials: <%= Rails.root.join("gcs_keyfile.json") %>
 bucket: 作成したバケット名

以上、簡単ですね!

では、herokuへのデプロイを書きます。

$ git add .
$ git commit -m "google cloud service"
$ git push heroku master
$ heroku run rails db:migrate
$ heroku open

エラーは出なかったでしょうか?

では、早速会員登録してみましょう!

うまく行きました!

次に、ログインをします。リンクをつけていないので、URLの最後に「/login」と直接入力してください。

うまくログインできました!

次に、meetingが登録できるか確認しましょう!「/meetings/new」を入力してください。

イベントの必須項目を入力して行きます。

うん、ちゃんと画像も表示されてますね!

では、投稿!

ん???

イベント詳細に画像が表示されていない・・・。

なぜだー!!!

リッチテキストへの画像挿入は、ダイレクトアップロードという仕組みを使っているらしいのですが、どうもそこの設定情報が間違っているようです。

とは言っても、webpackerでパッケージごとダウンロードしただけなので編集方法なんかわからない・・・。

色々調べた(10時間くらい)結果、、、、諦めました!!!

バグ?の修正を待つことにします。

でも、どうしてもアップしたかったので、色々調べて別の方法でアップできることを発見!

自分のサイトに画像データをアップロードするのではなく、別のサイトから読み込ませるようにすれば画像の表示をできることがわかりました。

▼手順

・GCSに手動でアップロード

・アップロードした画像をコピー。(右クリックで「画像をコピー」)

・投稿画面に貼り付け

・投稿

きたー!!!

以上、herokuへのデプロイ完成!!

ちょっと、色々と手間取ったけどなんとかなったねw

次こそは、予約機能を作って行きまーす!

サポートしていただけると、泣いて喜びます! 嬉しくて仕事をめちゃめちゃ頑張れます。