Edited at

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

More than 1 year has passed since last update.


動作環境


  • 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



サーバ再起動

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

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