Rails action_text切换到亚马逊主动存储后没有上传

Question

当我在 action_text 中附加图像或其他文件（使用 trix 编辑器）时，图像会显示灰色的进度条，并且不会取得任何进展，并且文件也不会上传。

我在日志中得到了这个：

Started POST "/rails/active_storage/direct_uploads" for 127.0.0.1 at 2020-09-21 14:34:32 -0400
Processing by ActiveStorage::DirectUploadsController#create as JSON
  Parameters: {"blob"=>{"filename"=>"20190114_085126.jpg", "content_type"=>"image/jpeg", "byte_size"=>2865061, "checksum"=>"B2V2/VIDZ0oijiVW/57ZOQ=="}, "direct_upload"=>{"blob"=>{"filename"=>"20190114_085126.jpg", "content_type"=>"image/jpeg", "byte_size"=>2865061, "checksum"=>"B2V2/VIDZ0oijiVW/57ZOQ=="}}}
   (0.3ms)  BEGIN
  ActiveStorage::Blob Create (1.3ms)  INSERT INTO "active_storage_blobs" ("key", "filename", "content_type", "byte_size", "checksum", "created_at") VALUES ($1, $2, $3, $4, $5, $6) RETURNING "id"  [["key", "8l50q4ttoz20x6ixwvgnefodu9p6"], ["filename", "20190114_085126.jpg"], ["content_type", "image/jpeg"], ["byte_size", 2865061], ["checksum", "B2V2/VIDZ0oijiVW/57ZOQ=="], ["created_at", "2020-09-21 18:34:32.952044"]]
   (0.5ms)  COMMIT
[Aws::S3::Client 0 0.000591 0 retries] put_object(content_type:"image/jpeg",content_length:2865061,content_md5:"B2V2/VIDZ0oijiVW/57ZOQ==",bucket:"mweiser-testbucket",key:"8l50q4ttoz20x6ixwvgnefodu9p6")

  S3 Storage (1.5ms) Generated URL for file at key: 8l50q4ttoz20x6ixwvgnefodu9p6 (https://mweiser-testbucket.s3.amazonaws.com/8l50q4ttoz20x6ixwvgnefodu9p6?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIA4MREWXD52IVDRYOD%2F20200921%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20200921T183432Z&X-Amz-Expires=300&X-Amz-SignedHeaders=content-length%3Bcontent-md5%3Bcontent-type%3Bhost&X-Amz-Signature=31e7a09e7d120c56a89592e8c0a5df46a91e23a32d1af7bf1a513d013a4ab264)
Completed 200 OK in 13ms (Views: 0.2ms | ActiveRecord: 2.1ms | Allocations: 3426)

我已经测试过直接调用 s3 （参见下面的代码）并且上传有效。

>> s3 = Aws::S3::Client.new
=> #<Aws::S3::Client>
>> res = Aws::S3::Resource.new  
=> #<Aws::S3::Resource:0x000000000a59eed0 @client=#<Aws::S3::Client>>
>> bucket = res.bucket('mweiser-testbucket')
=> #<Aws::S3::Bucket:0x000000000a735cf8 @name="mweiser-testbucket", @data=nil, @client=#<Aws::S3::Client>, @waiter_block_warned=false, @arn=nil>
>> obj = bucket.object('testfile.pdf')
=> #<Aws::S3::Object:0x000000000a759388 @bucket_name="mweiser-testbucket", @key="testfile.pdf", @data=nil, @client=#<Aws::S3::Client>, @waiter_block_warned=false>
>> result = obj.upload_file('./erd.pdf')
=> true
[Aws::S3::Client 200 0.380179 0 retries] put_object(bucket:"mweiser-testbucket",key:"testfile.pdf",body:#<File:./erd.pdf (51715 bytes)>)  

瞧...我的文件已上传。我的凭据都在 1 个位置，所以这不是权限问题。action_text 与 :local 完美配合。

我错过了什么？

Answer 1

找到解决方案...存储桶的 CORS 设置。

在这里找到： https: //gorails.com/episodes/how-to-use-action-text

事实证明这是一个 CORS 问题，Chris 在这里制作了一个视频： https://gorails.com/episodes/cross-origin-resource-sharing-with-rails ?autoplay=1

除此之外，我还必须在 S3 存储桶设置中设置 CORS 配置。这是对我来说结束工作的配置：

<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
  <CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedHeader>*</AllowedHeader>
  </CORSRule>
</CORSConfiguration>