如何使用 Sinatra 和 AngularJS 将对象从 AWS S3 流式传输到浏览器

How to stream object from AWS S3 to browser using Sinatra and AngularJS

我能够使用 Ruby 中的以下 post 请求将 S3 对象从磁盘流式传输到浏览器:

post '/api/s3/download/?' do
   filepath = "/tmp/test.txt"
   send_file(filepath, :filename => File.basename(filepath))
end

以及 javascript 中的以下 AngularJS:

$http.post('/api/s3/download/')
  .then(function(response) {
    var blob = new Blob([response.data]);
    var objectUrl = URL.createObjectURL(blob);
    const anchor = angular.element('<a></a>');
    anchor.attr('href', objectUrl);
    anchor.attr('download', source);
    anchor.css('display', 'none');
    angular.element(document.body).append(anchor);
    anchor[0].click();
  }, function(error_msg) {
    console.log(error_msg);
  });

我在 Ruby 中尝试了以下方法来获取 S3 对象作为 StringIO,其中 source 是 S3 对象键:

s3 = Aws::S3::Resource.new
bucket = s3.bucket('my_bucket')
data = bucket.object(source).get

然后我尝试返回 data.body 作为对 javascript 的响应,但这没有用。

如何在不将文件具体化到磁盘的情况下获取 StringIO 对象并将其作为八位字节流发送到浏览器?

我使用以下端点让它工作:

get '/api/s3/download' do
  source = params[:source]
  headers['Content-Type'] = 'application/octet-stream'
  headers['Content-Disposition'] = "attachment; filename=#{source}"
  stream do |out|
    s3.client.get_object(bucket: 'my_bucket', key: source) do |chunk|
      out << chunk
    end
    out.flush
  end
end

并在 Javascript 中的前端执行以下操作会在浏览器中打开一个新选项卡,通过该选项卡进行下载:

$window.open('/api/s3/download?source=' + source), '_blank');