Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Active Storageについて

Active Storageについて

Shinjuku.rb #60 Rails5.2で発表した内容です。

Shinya Fujita

April 26, 2018
Tweet

More Decks by Shinya Fujita

Other Decks in Programming

Transcript

  1. プロフィー ル 仕事では R ails を書いています 趣味で J inr o

    L it eというサイトを運営しています 最近は G olangを勉強したい気分 5/7からラクスルという会社に転職します(現在は有給消化中) 2
  2. A ctive S torageの概要 R ails5.2から追加された機能 ファイルアップロー ド機能の提供(A maz on

    S 3, G oogle C lou d S t or age, M icr os oft A zur e S t or ageに対応) ダイレクトアップロー ドが可能 画像サイズの変換も可能 3
  3. 既存 G emとの違い メリット R ails に組み込まれた機能なのでモデルへのカラム追加などが不 要 G emに依存しなくてもよい

    デメリット 最低限の機能しかない ※ 例えば、 ファイルのバリデー ションやファイル名変換機能は ない 4
  4. 使い方 c l a s s U s e r

    < A p p l i c a t i o n R e c o r d h a s _ o n e _ a t t a c h e d : a v a t a r e n d # u s e r にファイルを紐付け u s e r . a v a t a r . a t t a c h ( i o : F i l e . o p e n ( " / p a t h / t o / f a c e . j p g " ) ) u s e r . a v a t a r . a t t a c h e d ? # = > t r u e # 紐付けられたファイルの削除 u s e r . a v a t a r . p u r g e 5
  5. 使い方 # U R L を取得 u r l _

    f o r ( u s e r . a v a t a r ) # V i e w < d i v c l a s s = " f i e l d " > < % = f o r m . l a b e l : a v a t a r % > < % = f o r m . f i l e _ f i e l d : a v a t a r % > < / d i v > # C o n t r o l l e r c l a s s A v a t a r s C o n t r o l l e r < A p p l i c a t i o n C o n t r o l l e r d e f u p d a t e c u r r e n t _ u s e r . a v a t a r . a t t a c h ( p a r a m s [ : u s e r ] [ : a v a t a r ] ) e n d e n d 6
  6. 使い方(S 3を利用) # c o n f i g /

    s t o r a g e . y m l a m a z o n : s e r v i c e : S 3 a c c e s s _ k e y _ i d : < % = E N V [ ' A W S _ A C C E S S _ K E Y ' ] % > s e c r e t _ a c c e s s _ k e y : < % = E N V [ ' A W S _ S E C R E T _ K E Y ' ] % > r e g i o n : a p - n o r t h e a s t - 1 b u c k e t : < % = E N V [ ' A W S _ B U C K E T ' ] % > # c o n f i g / e n v i r o n m e n t s / d e v e l o p m e n t . r b c o n f i g . a c t i v e _ s t o r a g e . s e r v i c e = : a m a z o n 7
  7. デー タ構造 A tt achment と B lobという組み込みのモデルが存在している B lob:

    ファイルに関する情報を持つ(ファイル名、 メタデー タ等) A tt achment: 対象クラスと B lobの紐付け情報を持つ 8
  8. A ttachment # < A c t i v e

    S t o r a g e : : A t t a c h m e n t : 0 x 0 0 0 0 7 f 8 8 9 4 2 9 1 3 6 8 > { : i d = > 1 , : n a m e = > " a v a t a r " , : r e c o r d _ t y p e = > " U s e r " , : r e c o r d _ i d = > 1 , : b l o b _ i d = > 1 , : c r e a t e d _ a t = > W e d , 2 5 A p r 2 0 1 8 1 5 : 1 3 : 5 7 J S T + 0 9 : 0 0 } 9
  9. B lob # < A c t i v e

    S t o r a g e : : B l o b : 0 x 0 0 0 0 7 f 8 8 9 5 d d 4 1 c 0 > { : i d = > 1 , : k e y = > " Z m 2 c 7 A v k r k 4 R 4 K 4 E B U w z b 6 s n " , : f i l e n a m e = > # < A c t i v e S t o r a g e : : F i l e n a m e : 0 x 0 0 0 0 7 f 8 8 9 8 2 7 6 3 : c o n t e n t _ t y p e = > " i m a g e / p n g " , : m e t a d a t a = > { " i d e n t i f i e d " = > t r u e , " w i d t h " = > 8 1 , " h e i g h t " = > 7 8 , " a n a l y z e d " = > t r u e } , : b y t e _ s i z e = > 1 0 4 3 1 , : c h e c k s u m = > " n j F m q S h Z 3 6 X A u b m P B M E M X g = = " , : c r e a t e d _ a t = > W e d , 2 5 A p r 2 0 1 8 1 5 : 1 3 : 5 7 J S T + 0 9 : 0 0 } 10
  10. ダイレクトアップロー ドについて A ct iv e S t or ageはダイレクトアップロー

    ドをサポー トしている ダイレクトアップロー ドを利用することで W ebサー バー のリソー ス を節約できる 例えば、H er oku では30秒以上のリクエストはタイムアウトしてし まうので、 ファイル容量や回線状況によっては必須になる(公式でも 4MB 以上はダイレクトアップロー ド推奨になっている) 11
  11. 使い方 # a c t i v e s t

    o r a g e . j s をインクルー ド / / = r e q u i r e a c t i v e s t o r a g e # V i e w < d i v c l a s s = " f i e l d " > < % = f o r m . l a b e l : a v a t a r % > < % = f o r m . f i l e _ f i e l d : a v a t a r , d i r e c t _ u p l o a d : t r u e % > < / d i v > 注意点 ブラウザからクラウドストレー ジにアップロー ドする際にドメインまた ぎになるので、 クラウドストレー ジ側で CORS の設定が必要な場合があ る。(S 3の場合はデフォルトは GET のみ許可しているので、PUT を追加 した) 12
  12. ファイルアップロー ド時の処理フロー B lobを作成 & S 3アップロー ドに利用する URL とヘッダー

    を返却 S 3にアップロー ド A tt achment を作成 A nalyz e J ob(メタデー タの解析)をキュー に入れる 13
  13. 困ったこと 1.ファイルアップロー ド時にファイルに関係ない項目のバリデー シ ョンエラー があった際、 デー タの不整合が発生する このissu eに記載した。

    結局は自分の使い方が悪く、 対象クラスにファイルを登録する時 に a t t a c h ではなく u p d a t e を使ってしまっていた事が原因だった。 14
  14. 困ったこと 2.画像ファイルの C ache‑C ontrolを変更したい デフォルトでは5分になっており、 変更することは想定していないよう だった。 アンチパター ンと思いつつ、

    モンキー パッチを当てて対応した。 # l i b / m o n k e y _ p a t c h e s / m o n k e y _ p a t c h _ r e p r e s e n t a t i o n s _ c o n t r o l l e r . r b c l a s s A c t i v e S t o r a g e : : R e p r e s e n t a t i o n s C o n t r o l l e r < A c t i v e S t o r a g e : i n c l u d e A c t i v e S t o r a g e : : S e t B l o b d e f s h o w e x p i r e s _ i n 1 2 0 . m i n u t e s r = @ b l o b . r e p r e s e n t a t i o n ( p a r a m s [ : v a r i a t i o n _ k e y ] ) r e d i r e c t _ t o r . s e r v i c e _ u r l ( e x p i r e s _ i n : 1 2 0 . m i n u t e s , d i s p o s i t e n d e n d 15