BackEnd

Shrineを使って画像をアップロードする

投稿日:2017年4月21日 更新日:

はじめに

こんにちは、onoです。

以前、CarrierWaveを使って画像をアップロードするフォームを作成しました。

CarrierWaveは多機能で使いやすいGemだと思いますが、コードが大きく複雑なため、一般的な使い方から外れた場合や問題が発生した場合に処理を追っていくのが大変です。

そこで、今回は実装がシンプルで必要な機能を選んで追加できるShrineを使ってみます。

Shrineとは

簡単な説明

Shrineはファイルをアタッチするためのツールです。
主に画像をアップロードする際に利用されるのではないかと思います。

作者

ShrineはJanko Marohnić氏(リポジトリはこちら)が2015年9月から開発しています。

特徴

主な特徴としては下記の2つが挙げられます。

  • Shrine本体は必要最小限の機能のみを実装しているため、シンプルでコードが小さい。
  • リサイズやダイレクトアップロードなど、必要な機能のみをプラグインで追加できる。

 

下準備

Gemを追加

プロジェクトを作成後、Gemfileに下記のGemを追加します。

 

初期設定

画像をアップロードするディレクトリの指定と使用するプラグインを宣言します。
アプリケーション全体で共通の設定は、config/initializers/で行います。

 

テーブルを作成する

アップロードした画像を管理するテーブルを作成します。
アップロードした画像の情報を保存するカラムはtext型の「xxx_data」という名前にします(xxxはモデルの中でアップローダをアタッチする際に指定するシンボル名)

 

実装

Uploaderの実装

モデルにアタッチするアップローダを実装します。
特にディレクトリに指定はありませんが、app/uploaders/に追加していきます。

 

Modelの実装

実装したアップローダをアタッチします。

 

Controllerの実装

下記の通り、scaffoldで生成したコードの一部を修正します。

 

Viewの実装

画像をアップロードするフォームを実装します。
アップロードした画像のアドレスはxxx_urlで取得できます(xxxはモデルの中でアップローダをアタッチする際に指定するシンボル名)

 

インサートされるレコード

フォームから画像をアップロードして保存すると、下記のようなレコードがインサートされます。

 

さいごに

今後はプラグインを追加して、ファイル名の変更、リサイズ、サムネイルの作成などを行なっていきます。

page_footer_300rect




page_footer_300rect




-BackEnd

執筆者:


comment

メールアドレスが公開されることはありません。

CAPTCHA


関連記事

Go言語

Go言語で使えるORMライブラリ

1 はじめに2 ORMライブラリ2.1 GORM2.2 SQLBoiler3 GORMを使ってみる3.1 導入3.2 migration3.3 insert3.4 select3.5 update3. ...

rails

Ruby、Railsの時間に関するメソッドを使用してみた

はじめに 普段PHPのお仕事をしています、tonnyです。 半年程前からRuby on Railsの勉強を始めました。 今回はよく使う時間に関するメソッドついてまとめたいと思います。 目次 1 はじめ ...

Vue.js入門その4〜TODOアプリにサーバーサイドを追加してみる〜

1 はじめに2 準備2.1 今回作成したいもの2.2 環境構築3 サーバーサイド3.1 DB3.2 メモ:rails generateで余分なファイルを生成しない3.3 作成したファイル4 ビューの作 ...

markdownで書けるドキュメントツールのGitbookを試す

1 はじめに2 Gitbookとは3 nvm4 node.jsインストール5 Gitbook導入5.1 インストール5.2 初期化5.3 ローカルでブラウザから確認6 作成と編集6.1 見出し編集7 ...

laravel logo

[Laravel] middlewareでHTTPリクエストの前後に処理を入れる

1 はじめに2 middlewareとは3 実装3.1 middleware作成3.2 コード実装4 middleware定義4.1 常に呼び出す4.2 特定のURLにアクセスした時のみ呼び出す4.3 ...

フォロー

follow us in feedly

page_side_300rect

2017年4月
« 3月 5月 »
 1
2345678
9101112131415
16171819202122
23242526272829
30 

アプリ情報

目標を達成したい方を応援する、TODOアプリもリリースしております。 下記のアイコンから無料でダウンロードできます。

Web版MyCoach

私たちはより広い方にコーチングを知ってもらいたいと考えています。 下記のサイトにて、コーチの方々を紹介しておりますので、よろしければご覧ください。