Herokuデプロイ時のエラー enum

やりたいこと

Herokuにデプロイした後、ページを開く事ができなかったのでheroku logs --taillで確認したところ以下のエラーが発生していた。このエラーを解消したい。

ActionView::Template::Error (undefined method `humanize' for 0:Integer):
<p>店舗名：<%= sub.stores_i18n %></p>

調査

qiita.com

エラー原因

mainテーブルとsubテーブルにおいてenumを使用した。

main.rb

enum stores: { seven: 0, lawson: 1, family: 2 }

sub.rb

enum stores: { seven: 0, lawson: 1, family: 2 }

enumを複数カラムで同じ名前を使う時、main.stores_i18n、sub.stores_i18nでどちらのプログラムを見ればいいか分からなくなるのでherokuでエラーが発生した。この場合_prefix: trueをつけることで解決する事ができます。

enum stores: { seven: 0, lawson: 1, family: 2 }, _prefix: true

Activestorage Attachment validatesのエラー

やりたいこと

new画面でActivestorage Attachmentを使いファイルを添付した。その時に以下のgemをinstallし拡張ファイルにvalidatesを実装したい。

gem 'active_storage_validations'

main.rbに以下を記載したところエラーが発生。

main.rb

has_one_attached :image

validates: image, content_type: [:png, :jpg, :jpeg]

エラー内容

Unknown validator: 'ContentTypeValidator'

原因

content_type.in?としてあげることで解決

  validate :image_content

  def image_content
    extension = ['image/png', 'image/jpg', 'image/jpeg']
    errors.add(:image, "の拡張子が間違っています") unless image.content_type.in?(extension)
  end

chartkick SQLの連続表示を阻止

やりたいこと

food_combinationという中間テーブルから、mainテーブルのnameとsugarをグラフとして表示させたい。

schema.rb

  create_table "mains", options: "ENGINE=InnoDB DEFAULT CHARSET=utf8mb4", force: :cascade do |t|
    t.string "name"
    t.string "image"
    t.integer "genre", default: 0, null: false
    t.integer "calorie"
    t.float "sugar"
    t.float "lipid"
    t.float "salt"
    t.datetime "created_at", precision: 6, null: false
    t.datetime "updated_at", precision: 6, null: false
  end

view

<% @foods.each do |food| %>
  <div class="food_graph">
      <% chart = [
      { data: food.where(id :food.main_id).pluck(:name, :sugar) }
      ] %>
     <%= bar_chart chart, colors: ["#185ADB", "#666"], min: 0, max: 100 %>
  </div>
<% end %>

調査

chartkick.com

原因

• そもそもeachの中でwhereやpluckメソッドを使っているので、要素毎にSQL接続してしまっている。

解決

food_combination.rb

  def get_sugar
    { '組み合わせ成分値': sprintf("%.1f", main.sugar + sub.sugar) }
  end

view

<% @foods.each do |food| %>
     <div class="food_graph">
         <% chart = [
          { name: '糖質(g)', data: food.get_sugar }
          ] %>
         <%= bar_chart chart, colors: ["#185ADB", "#666"], min: 0, max: 100 %>
     </div>
<% end %>

Herokuデプロイ時のエラー

やりたいこと

Herokuデプロイ時にエラーが現れたので現れたので解消したい。

remote:  !
remote:  !     Precompiling assets failed.
remote:  !
remote:  !     Push rejected, failed to compile Ruby app.
remote: 
remote:  !     Push failed
remote: Verifying deploy...
remote: 
remote: !   Push rejected to healthy-combi.
remote: 
To https://git.heroku.com/healthy-combi.git
 ! [remote rejected] main -> main (pre-receive hook declined)
error: failed to push some refs to 'https://git.heroku.com/healthy-combi.git'
urakamitakuya@urakamiuyanoMBP conve_recipe % git checkout -b message
Switched to a new branch 'message'

調査

heroku logs --tail

2021-10-08T03:55:33.071559+00:00 app[web.1]: [9248df1e-fcc3-43b0-95a2-cd14e7ad95e1]     42:       <div class="concept-img">
2021-10-08T03:55:33.071560+00:00 app[web.1]: [9248df1e-fcc3-43b0-95a2-cd14e7ad95e1]     43:         <%= image_pack_tag("media/images/boxed.jpg", class: 'w-100') %>
2021-10-08T03:55:33.071560+00:00 app[web.1]: [9248df1e-fcc3-43b0-95a2-cd14e7ad95e1]     44:       </div>
2021-10-08T03:55:33.071561+00:00 app[web.1]: [9248df1e-fcc3-43b0-95a2-cd14e7ad95e1]     45:       <div class="concept-text-box">
2021-10-08T03:55:33.071561+00:00 app[web.1]: [9248df1e-fcc3-43b0-95a2-cd14e7ad95e1]     46:         <div class="concept-text-main">
2021-10-08T03:55:33.071561+00:00 app[web.1]: [9248df1e-fcc3-43b0-95a2-cd14e7ad95e1]
2021-10-08T03:55:33.071562+00:00 app[web.1]: [9248df1e-fcc3-43b0-95a2-cd14e7ad95e1] app/views/static_pages/home.html.erb:43
2021-10-08T03:55:33.072062+00:00 heroku[router]: at=info method=GET path="/" host=healthy-combi.herokuapp.com request_id=9248df1e-fcc3-43b0-95a2-cd14e7ad95e1 fwd="60.66.51.144" dyno=web.1 connect=0ms service=5ms status=500 bytes=1827 protocol=https

エラー解決

webpackerに移行したがimage_pack_tagが読み込まれていない事が原因だった。

application.js内の以下の記述をコメントアウトするのを忘れていました。 application.js

const images = require.context('../images/', true)

ゲストログイン機能をつける

やりたいこと

ポートフォリオ作成中なのですが、ユーザーさんに気軽に使って頂くためゲストログイン機能をつけたい。

ちなみログイン認証はsorceryで行っています。

調査

rails ゲストログイン機能と検索

qiita.com

blog.aiandrox.com

調査した結果、sorceryのメソッドであるauto_login(user)を使ってゲストログイン機能をつけていきます。

実装

view

<%= link_to t('.guest_login'), 'guest_login', method: :post %>

routes.rb

post 'guest_login', to: 'user_sessions#guest_login'

user_sessions_controller.rb

  skip_before_action :require_login, only: %i[guest_login]

  def guest_login
    redirect_to root_path, alert: 'すでにログインしています' if current_user # ログインしてる場合はユーザーを作成しない

    random_value = SecureRandom.hex
    user = User.create!(name: random_value, email: "test_#{random_value}@example.com", password: "#{random_value}", password_confirmation: "#{random_value}", role: :guest)
    auto_login(user)
    redirect_to  select_food_combinations_path, notice: 'ゲストとしてログインしました'
  end

こんな感じで、ゲストログイン時に新たにユーザーを作成するようにする。

ログインするたびに新規ユーザーを作成するので、それぞれのゲストユーザーのデータが競合しない。

削除したファイルを復元する

やりたいこと

rm -rf binコマンドでbin以下のファイルを削除してしまったので復元したい。

調査

削除したファイル 復元で検索

creat4869.hatenablog.com

実行したこと

• とりあえずgit pushてgithubにデプロイしました。

• ターミナル上で以下のコマンドを打つことで、今まで削除されたファイルの一覧が表示されます。

git log --diff-filter=D --summary 

すると削除した履歴とコミット番号が出てくると思います。 復元したいファイル名の上の方にcommitという記述があると思うので、 その横にあるコミット番号をコピーしておきます。

↓

commit ae2ab1ae1eb73324541bd35802d070907a285f45 (origin/fix, fix) //ここです
Author: takuya178 <takuya.u1005@gmail.com>
Date:   Sat Oct 2 11:38:24 2021 +0900

そして以下を打つことで、削除したファイルを復元できます。

git checkout コミットの番号^ -- ディレクトリ名/ファイル名

git checkout ae2ab1ae1eb73324541bd35802d070907a285f45^ -- bin/bundle

chartkick heroku環境でchartkick.rbの編集内容が反映されない

やりたいこと

開発環境では、chartkick.rbで編集したグラフが表示されているが

本番環境ではデフォルトの状態で表示された。

本番環境でも開発環境と同様のグラフを表示させたい。

調査

chartkick.rb herokuで検索 qiita.com

原因

• gem 'chartkick.rb'をインストールした時にchartkick.rbの配置場所が間違っていた。

• application.jsに記載されている内容に誤りがあった。

解決

chartkick.rbファイルをconfig/initializers/chartkick.rbに移動

application.js

require("chartkick").use(require("highcharts"))

use(require("highcharts")を追加。