Ruby on rails 直接在Rails中上传S3图像并作出反应

我想直接从客户端上传图片，但我做不好。有人能帮我吗

版本：

轨道5.1.1

ruby 2.4.1

aws sdk 2.10.3

我的逻辑

药物并将图像拖放到Dropzone字段

通过axios进行ajax调用，然后获得signedUrl

通过发出带有signedUrl的put请求来上载图像文件

客户端（react）：我正在使用react dropzone

handleOnDrop = (files) => {
    files.map(file => this.uploadImage(file))
}

uploadImage = (file) =>{
    axios.get('http://localhost:3000/upload/',
    {
      params: {
        filename: file.name
      }
    })
      .then(res => { 
        const signedUrl = res.data.url;
        return axios.put(signedUrl, file) 
      })
      .then((result) => console.log(result))
      .catch(e => console.log(e));
}

...
<Dropzone onDrop={this.handleOnDrop} >

控制器

class S3Controller

错误日志

TypeError: Cannot read property 'protocol' of undefined
    at isURLSameOrigin (eval at <anonymous> (webpack-bundle.self-2cf7062….js?body=1:3328), <anonymous>:57:21)
    at dispatchXhrRequest (eval at <anonymous> (webpack-bundle.self-2cf7062….js?body=1:2070), <anonymous>:109:50)
    at Promise (<anonymous>)
    at xhrAdapter (eval at <anonymous> (webpack-bundle.self-2cf7062….js?body=1:2070), <anonymous>:12:10)
    at dispatchRequest (eval at <anonymous> (webpack-bundle.self-2cf7062….js?body=1:3265), <anonymous>:52:10)
    at <anonymous>

TypeError:无法读取未定义的属性“protocol”
在iUrlsameorigin（评估地址（webpack bundle.self-2cf7062…js？body=1:3328），：57:21）
在DispatchXhreRequest（在（webpack bundle.self-2cf7062….js？body=1:2070），：109:50进行评估）
允诺
在xhrAdapter（在（webpack bundle.self-2cf7062….js？body=1:2070），：12:10评估）
发送请求时（评估地址（webpack bundle.self-2cf7062…js？body=1:3265），：52:10）
在

...
get 'upload', to: 's3#upload'
...

class S3Controller < ApplicationController
  def upload
     render json: S3_BUCKET.object("uploads/#{SecureRandom.uuid}/#{params[:filename]}").presigned_url(:get)
  end
end

TypeError: Cannot read property 'protocol' of undefined
    at isURLSameOrigin (eval at <anonymous> (webpack-bundle.self-2cf7062….js?body=1:3328), <anonymous>:57:21)
    at dispatchXhrRequest (eval at <anonymous> (webpack-bundle.self-2cf7062….js?body=1:2070), <anonymous>:109:50)
    at Promise (<anonymous>)
    at xhrAdapter (eval at <anonymous> (webpack-bundle.self-2cf7062….js?body=1:2070), <anonymous>:12:10)
    at dispatchRequest (eval at <anonymous> (webpack-bundle.self-2cf7062….js?body=1:3265), <anonymous>:52:10)
    at <anonymous>