CKEditor + S3 + paperclipでの画像アップロードでAccessDenied #Ruby

動作環境

Ruby 2.3.1
Rails 5.0.3

gemのインストール

Gemfile


gem 'ckeditor'
gem 'paperclip'

CarrierWaveもあるが、paperclipの方が設定が単純だった

CKeditor設定


$ bundle
$ rails generate ckeditor:install --orm=active_record --backend=paperclip
$ rake db:migrate

画像用のモデルの設定

app/models/ckeditor/picture.rb


class Ckeditor::Picture < Ckeditor::Asset
  has_attached_file :data,
                    storage: :s3,
                    s3_credentials: {
                      access_key_id: Settings.aws_access_key_id,
                      secret_access_key: Settings.aws_secret_access_key,
                      bucket: Settings.aws_s3_bucket
                    },
                    s3_region: 'ap-northeast-1',
                    s3_permissions: 'public-read',
                    s3_host_alias: Settings.aws_s3_host_alias,
                    s3_protocol: :https,
                    url: ':s3_alias_url',
                    path: ':rails_root/public/ckeditor_assets/pictures/:id/:style_:basename.:extension',
                    styles: { content: '800>', thumb: '118x100#' }

  validates_attachment_presence :data
  validates_attachment_size :data, less_than: 2.megabytes
  validates_attachment_content_type :data, content_type: /\Aimage/

  def url_content
    url(:content)
  end
end

バケット名やAWSアクセスキーは Setting logic を利用

AccessDeniedエラー発生

CKeditorから画像をアップロードしたところ、 AWS::S3::AccessDenied というエラーが発生した。

原因は path の設定だった。
デフォルトで生成されるパスは
:rails_root/public/ckeditor_assets/pictures/:id/:style_:basename.:extension だが、これは外部ストレージを使わず、ファイル形式でコンピュータ内に画像をアップロードするときのパスである。
しかしS3のような外部ストレージを利用するときは (bucket_name)/ckeditor_assets/pictures/:id/:style_:basename.:extension を参照する。
今回はS3の設定で (bucket_name)/ckeditor_assets 以下のアクセス許可が出ている状態だったにもかかわらず、 :rails_root/public/ckeditor_assets を参照しようとしていたため、 そんなパスは許可してない と怒られてしまったようだ。

そこで以下のようにパスを修正

app/models/ckeditor/picture.rb


class Ckeditor::Picture < Ckeditor::Asset
  has_attached_file :data,
                    storage: :s3,
                    s3_credentials: {
                      access_key_id: Settings.aws_access_key_id,
                      secret_access_key: Settings.aws_secret_access_key,
                      bucket: Settings.aws_s3_bucket
                    },
                    s3_region: 'ap-northeast-1',
                    s3_permissions: 'public-read',
                    s3_host_alias: Settings.aws_s3_host_alias,
                    s3_protocol: :https,
                    url: ':s3_alias_url',
                    path: '/ckeditor_assets/pictures/:id/:style_:basename.:extension', # ここのパスを修正
                    styles: { content: '800>', thumb: '118x100#' }

  validates_attachment_presence :data
  validates_attachment_size :data, less_than: 2.megabytes
  validates_attachment_content_type :data, content_type: /\Aimage/

  def url_content
    url(:content)
  end
end

サーバ再起動

モデルに記載していたので再起動必要ないと思いきや、必要だった。。

無事画像アップロード完了