ActiveStorage详细介绍

Posted on |

用rails新特性解决它们适合的问题

rails 5给我们提供了不少非常实用的新特性，使用它们替代旧方案，可以提高开发时抽象的层次，不必再考虑已经封装好的逻辑，将精力集中在和业务相关的代码开发上，减少bug，并降低维护的难度。
ActiveStorage就是这样的rails 5新特新之一。

ActiveStorage

ActiveStorage是rails框架内云端图片的上传方案。有直传和后端上传两种方式，并且支持不同大小的图片预览。使用起来非常简单。

后端上传

以创建带图片的消息为例:

  1. 创建一个消息模型, rails g scffold message title:string content:text
  2. rake active_storage:install 并执行 rake db:migrate 这一步会创建两张表 active_storage_attachments 和 active_storage_blobs
    active_storage_attachments 会将附件多态关联到其他记录上, 同时会关联 blob(blob并不存储实际的文件，而是存储文件的属性信息)

  3. 在模型上添加关联 has_many_attached :images

    1
    2
    3
    class Message < ApplicationRecord
      has_many_attached :images
    end

  4. 在form中使用辅助方法
    slim 版本

    1
    2
    3
    4
    5
    = form_with model: message do |form|
      = form.text_field :title, placeholder: "Title"
      = form.text_area :content
      = form.file_field :images
      = form.submit

  5. 在controller中将上传的图片绑定到message中

    1
    @message.images.attach params[:images]

大功告成了 文件可以通过active storage上传了
image.png-42.8kB
文件上传成功
image.png-37.8kB
可以看到后台把每个文件上传到了到了云端，并且创建了一个attachment和一个blob
image.png-97.3kB

直接上传云端

如果想要使用直传方案，只需要引入activestorage.js 并在视图端开启直传就可以了

1
2
//= require activestorage
#新建端rails项目会在全局默认引入

1
form.file_field :images, direct_upload: true

当点创建资源的时候可以看到，应用先去请求后端允许创建资源(1)，紧接着将图片上传到云端(2, 3)，最后将云端资源信息返回给服务器(4)
1，2，3，4对应下图中的四个请求

上传云端:
image.png-84.1kB
云端返回信息传递给rails:
image.png-53.2kB
rails利用返回的信息创建相应的attachment 和 blob:
image.png-70.7kB

ActiveStorage配置

配置ActiveStorage支持的云端服务非常简单，只需要提供身份认证信息就可以了。

1
2
3
4
5
6
# amazon:
#   service: S3
#   access_key_id: <%%= Rails.application.credentials.dig(:aws, :access_key_id) %>
#   secret_access_key: <%%= Rails.application.credentials.dig(:aws, :secret_access_key) %>
#   region: us-east-1
#   bucket: your_own_bucket

同时在相应的开发环境配置文件文件中开启对应的服务就行，比如我想在development.rb中启用amazon服务，只需指定它就可以了

1
2
# development.rb
config.active_storage.service = :amazon

github地址: https://github.com/rails/activestorage/tree/archive