Hitsuji_monのブログ~ 村上春樹のあれ ~

文学好きな組み込み系エンジニア

Docker上のRailsでcredentialsを設定し、APIを利用する

Docker上のRailsYoutube Data API v3を使う流れ

APIキーを取得し, OAuth2.0認証を経由してGoogle APIにアクセスする

tech.sanwasystem.com

  • 注意:取得したアクセストークンには有効期限があり、暫くしたらリフレッシュしなければならない。この点を元記事では「AWS Lambda」からGoogle APIにアクセスすることで解消している

APIを使った取得するデータの種類を, scopeを使って上記記事から変更

kakusuke98.hatenablog.com

APIキーをRailsアプリに取り入れる

秘密鍵管理にcredentials.yml.encを使う(Rails =>5.1)
これは通常のファイルの開き方だと、読み取り専用モードになってしまうので、以下のようにrailsで使えるcredentialsコマンドを使い編集する

# 注意: Dockerではこれだと動かない(vimを入れてない)
$ EDITOR=vim bin/rails credentials:edit

blog.naoshihoshi.com

今回の Docker上のRailsには、vimが入っていないので
Dockerfile内にvimのインストールを追記する。
エディタはvimじゃなくてもいいけど、vimで編集したい!!(好み)

qiita.com

# Docker上のRailsでcredentials.yml.encを編集
$ docker-compose run -e EDITOR="vim" web rails credentials:edit

credentialsに設定した環境変数の呼び出し方
以下のようにcredentials.yml.encに設定した場合

hoge: fuga
aws:
  access_key_id: 123
  secret_access_key: 345

次のようにして環境変数を呼び出す

Rails.application.credentials.hoge # => "fuga"
Rails.application.credentials.aws # => {:access_key_id=>123, :secret_access_key=>345}
Rails.application.credentials.aws[:access_key_id] # => 123

deviseを使っているアプリケーションで環境変数を設定している場合のことも含め上記の情報は次の記事の転載
qiita.com

credentials.yml.encに設定したAPIキーを使って、APIを叩く!!

実際にAPIをしようしてYoutubeの動画情報などを取得する。
参考に動かした例はこちら。

developers.google.com

qiita.com

kakusuke98.hatenablog.com

埋め込んだ動画サムネイルiframeをレスポンシブ 対応

apiで取得したサムネイル情報 iframeのレスポンシブ対応にちょっとてこずる

メディアクエリ使ってcss調整したけど、これでよかった

akros-ac.jp

qiita.com

www.slideshare.net

Docker-composeで起動中のコンテナにbinding.pryを挟んでデバッグする

Docker-compose でもbinding.pryを使いたい

  • ユースケース: deviseを使ってユーザー情報を管理しているが、current_userメソッドの「name」プロパティがnil Classエラーになる。
    • ログイン中なのになぜ.
    • binding.pryでログイン中のユーザ情報をオンタイムに確認したい

qiita.com

dai7igarashi.hatenablog.com

解決策
nameなんてプロパティはなかった

[2] pry(#<HomeController>)> current_user
=> #<User id: 1, email: "admin@admin.com", created_at: "2019-12-31 14:14:21", updated_at: "2019-12-31 14:32:22">

Docker-composeを用いたRails環境の構築

絶対忘れるのでメモ

目次

初期作業:Dockerイメージの作成

  • 作業プロジェクトの作成
$ mkdir myapp
  • Railsのイメージを作成する:Dockerfileの作成
$ vim Dockerfile
# Dockerfile
FROM ruby:2.6.3
# libpq-devはpostgresqlへの接続に必要
RUN apt-get update -qq && apt-get install -y build-essential libpq-dev node.js   
RUN mkdir /myapp
WORKDIR /myapp
COPY Gemfile /myapp/Gemfile
COPY Gemfile.lock /myapp/Gemfile.lock
# Gemのイントール。ここに記述されているので、ビルドする度に実行されることになる
RUN bundle install
# ビルドコンテキストの内容を/myappに置く      
COPY . /myapp   
  • Gemfileを作成し、Railsのバージョンを指定する
$ vim Gemfile
# Gemfile
source 'https://rubygems.org'
gem 'rails', '5.2.4'
  • 空の Gemfile.lockを作成する
    • bundle installが実行された時点で、インストールされたgemとそのバージョンのリストが書き込まれる
$ touch Gemfile.lock

初期作業:Dockerイメージのコンテナ設定(yml)

使用するコンテナの設定をdocker-compose.ymlに記述する

$ vim docker-compose.yml
# docker-compose.yml
version: '3'
services:
  db:
      image: postgres
  web:  # コンテナ名
      build: .       # ビルドコンテキストの指定
      command: bundle exec rails s -p 3000 -b '0.0.0.0'
      volumes:
          - .:/myapp
       ports:
         - "3000:3000"
       depends_on:
         - db      # このコンテナを実行する前に、dbコンテナが起動する

イメージファイルを取得し、コンテナを作成

:カレントディレクトリにrailsプロジェクトを作成

docker-compose.ymlに定義された形に従って、ホスト上のカレントディレクトリにrailsプロジェクトを作成する

$ docker-compose run web rails new . --force --database=postgresql
# --forceで事前に作成したGemfileを上書きするようにする
  • Errno::EACCES: Permission denied 権限でエラーされたら
    • 落ち着いてパーミションを確認する
$ ls -l # rootユーザで一部ファイルを作成してしまっていた
    • パーミションを現在のユーザに変更する
$ sudo chown Username 対象ファイル

ロケールの Warningが出たら、指示通りに修正する
HEADS UP! i18n 1.1 changed fallbacks to exclude default locale.
But that may break your application.

Please check your Rails app for 'config.i18n.fallbacks = true'.
If you're using I18n (>= 1.1.0) and Rails (< 5.2.2), this should be
'config.i18n.fallbacks = [I18n.default_locale]'.
If not, fallbacks will be broken in your app by I18n 1.1.x.

# config/environment/prodiction.rb
config.i18n.fallbacks = true
->
config.i18n.fallbacks = [I18n.default_locale]

イメージを更新するために再度build

現在イメージは最初のGemfileでビルドされた状態。Gemfile(.lock)が更新されたのでイメージに反映させたい。

そのため再度buildする。
忘れそうなので注意

$ docker-compose build

RailsAppのDB設定の修正

DBの設定を修正する

# config/database.yml

default: &default
  adapter: postgresql
  encoding: unicode
  host: db   # 追加
  username: postgres  # 追加.デフォルトユーザ
  password:    # 追加
  # For details on connection pooling, see Rails configuration guide
  # http://guides.rubyonrails.org/configuring.html#database-pooling
  pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>

development:
  <<: *default
  database: myapp_development
~~~

DBを作成する

$ docker-compose run web rails db:create
$ docker-compose run web rails db:migrate

ブラウザでアクセスし確認
ブラウザでlocalhost:3000にアクセス!!いつもの丘が表示!!やったね
f:id:Hitsuji_mon:20191222183811p:plain

ブラウザでTurbolinkのWarnigが出たとき

TurbolinkのWarning問題
状況

ブラウザの検証ツールで見ると、次のようなWarnigが出る

You are loading Turbolinks from a <script> element inside the <body> element. This is probably not what you meant to do!
Load your application’s JavaScript bundle inside the <head> element instead. <script> elements in <body> are evaluated with each page change.
For more information, see: https://github.com/turbolinks/turbolinks#working-with-script-elements

turbolinkをhtmlで読むときはhead内に書いてねと言っている
こちらの記事がすぐヒットした
Turbolinks を body タグ内で start させてはいけない · GitHub


原因
しかし今回は正しく記述しているので上記が原因ではなかった

理由: javascriptを二重に読み込んでいた

  • application.jsでjavascriptの読み込みをjsディレクトリ全体に指定
  • application.html.hamlでapplication.jsを読むようにheadに記述



解決
application.html.hamljavascriptの読み込みの記述を削除
↑これでエラーは出なくなるが,別の問題が生じた

問題: deviseでsign_outを正しく記述してもリクエストがGETで送信される
$ rails routes を実行すると以下のように正しくなっているのになぜ
$ destroy_user_session DELETE /users/sign_out(.:format)

deviseのセッションの消去を正しく使うには、viewでjavascriptの読み込みを正しく行う必要がある

# 誤り
= javascript_include_tag 'application', media: 'all', 'data-turbolinks-track' => true 
# 正しい: turbolinksのreloadの記述
= javascript_include_tag 'application', 'data-turbolinks-track': 'reload'

やっとsign_outが直った

api-keyを使ったAppをデプロイするときの注意

メモ

api-keyはどうやって秘匿されているんだっけ?

  • 根本となるkeyデータ: config/master.keyに記述されている
    • gitにはpushされない: デフォルトでgitignoreに指定が行われている


  • master.keyを秘匿化したkey : credentials.yml.enc
    • こちらはgitへpushされる
    • 暗号化されているので安心
    • エディタから編集できない。ターミナルからコマンド打たないと編集モードに移行できない

qiita.com

Docker環境のRailsでBundler::GemNotFoundが出た時

状況

  • DockerでRailsアプリケーションの環境構築
    • Dockerfile内に RUN bundle install と記述
  • 無事Rails環境を構築
  • docker-compose up で、Image構築からdocker-compose.ymlに記述してあるコンテナの起動までが行われる
  • ブラウザでアクセスすると、無事Welcomeページが表示される
  • webコンテナ上にモデルを生成しようとする
    • $docker-compose run web rails g model ~~
  • Bundler::GemNotFound エラー

エラーログを見ると、railsコマンドが参照しているrubyのバージョンが古い(systemのrubyを引いてる?)

解決策
タイトルがそのままの記事があった

qiita.com

  • 一度 $docker-compose build する
  • 再び docker-compose up

所感
よくわかっていない。upコマンドでイメージのビルドからコンテナの実行まで一通りやってくれるはずなので、明示的に docker-compose build する必要はないのでは?

dockerfile内に bundle installを入れているので、ビルドとGemの追加の順番が何かおかしくなっているのか

参考
Docker-composeを用いてRailsアプリを作った場合は、Gemfileを更新するたびにイメージをビルドする必要がある

  • Docker公式document

Now that you’ve got a new Gemfile, you need to build the image again. (This, and changes to the Gemfile or the Dockerfile, should be the only times you’ll need to rebuild.)

いちいちbuildし直したくない場合、docker-compopse.ymlの設定を修正すればいいいらしい
qiita.com

エラーになる仕組みについては、こちらがわかりやすかった
qiita.com

docker-composeを使ったコンテナへの接続
起動中のコンテナに接続する
blue21neo.blogspot.com

コンテナ内にinstallされているgemを確認する

$ docker-compose run web ls /usr/local/bundle/gems
actioncable-5.2.4	     msgpack-1.3.1
actionmailer-5.2.4	     nio4r-2.5.2
actionpack-5.2.4	     nokogiri-1.10.7
actionview-5.2.4	     orm_adapter-0.5.0
activejob-5.2.4		     paperclip-6.1.0
activemodel-5.2.4	     pg-1.1.4
activerecord-5.2.4	     pry-0.12.2
activestorage-5.2.4	     pry-byebug-3.7.0
activesupport-5.2.4	     pry-rails-0.3.9
addressable-2.7.0	     public_suffix-4.0.1
archive-zip-0.12.0	     puma-3.12.2
arel-9.0.0		     rack-2.0.7
autoprefixer-rails-9.7.3     rack-test-1.1.0
bcrypt-3.1.13		     rails-5.2.4
bindex-0.8.1		     rails-dom-testing-2.0.3
bootsnap-1.4.5		     rails-html-sanitizer-1.3.0
bootstrap-sass-3.4.1	     railties-5.2.4
builder-3.2.4		     rake-13.0.1
byebug-11.0.1		     rb-fsevent-0.10.3
capybara-3.29.0		     rb-inotify-0.10.0
childprocess-3.0.0	     regexp_parser-1.6.0
chromedriver-helper-2.1.1    responders-3.0.0
climate_control-0.2.0	     ruby_dep-1.5.0
coderay-1.1.2		     rubyzip-2.0.0
coffee-rails-4.2.2	     sass-3.7.4
coffee-script-2.4.1	     sass-listen-4.0.0
coffee-script-source-1.12.2  sass-rails-5.1.0
concurrent-ruby-1.1.5	     sassc-2.2.1
crass-1.0.5		     sassc-rails-2.1.2
devise-4.7.1		     selenium-webdriver-3.142.6
erubi-1.9.0		     simple_form-5.0.1
execjs-2.7.0		     spring-2.1.0
ffi-1.11.3		     spring-watcher-listen-2.0.1
globalid-0.4.2		     sprockets-3.7.2
haml-5.1.2		     sprockets-rails-3.2.1
i18n-1.7.0		     temple-0.8.2
io-like-0.3.0		     terrapin-0.6.0
jbuilder-2.9.1		     thor-1.0.0
jquery-rails-4.3.5	     thread_safe-0.3.6
listen-3.1.5		     tilt-2.0.10
loofah-2.4.0		     turbolinks-5.2.1
mail-2.7.1		     turbolinks-source-5.2.0
marcel-0.3.3		     tzinfo-1.2.5
method_source-0.9.2	     uglifier-4.2.0
mime-types-3.3		     warden-1.2.8
mime-types-data-3.2019.1009  web-console-3.7.0
mimemagic-0.3.3		     websocket-driver-0.7.1
mini_mime-1.0.2		     websocket-extensions-0.1.4
mini_portile2-2.4.0	     xpath-3.2.0
minitest-5.13.0