Rails Amazon S3 прямая загрузка с загрузчиком файлов JQuery

Question

Я потратил несколько дней, пытаясь сделать эту работу. Я получаю эту ошибку

OPTIONS https://bucketname.s3.oregon.amazonaws.com/ сетка :: ERR_NAME_RESOLUTION_FAILED

Я использую Version 43.0.2357.130 Ubuntu 14.04 (64-bit)

Gemfile:

gem "jquery-fileupload-rails" 
gem 'aws-sdk' 

application.js (после JQuery):

//= require jquery-fileupload/basic 

application.css:

*= require jquery.fileupload 
*= require jquery.fileupload-ui 

У меня есть модель под названием загрузки, которые я сгенерированные подмости для так:

rails generate scaffold Upload upload_url:string 

uploads_controller.rb:

def new 
    @s3_direct_post = Aws::S3::PresignedPost.new(Aws::Credentials.new(ENV['AWS_S3_ACCESS_KEY_ID'], ENV['AWS_S3_SECRET_ACCESS_KEY']), 
               "Oregon", ENV['AWS_S3_BUCKET'], { 
               key: '/uploads/object/test.test', 
               content_length_range: 0..999999999, 
               acl: 'public-read', 
               success_action_status: "201", 
               }) 
    @upload = Upload.new 
end 

_form.html .erb (для загрузки):

<%= form_for(@upload, html: { class: "directUpload" }) do |f| %> 
...... 
<div class="field"> 
    <%= f.label :upload_url %><br> 
    <%= f.file_field :upload_url %> 
</div> 
...... 
<%= content_tag "div", id: "upload_data", data: {url: @s3_direct_post.url, form_data: @s3_direct_post.fields } do %> 
<% end %> 

application.js (в конце):

$(document).ready(function() { 
     $(function() { 
     $('.directUpload').find("input:file").each(function(i, elem) { 
     var fileInput = $(elem); 
     var form   = $(fileInput.parents('form:first')); 
     var submitButton = form.find('input[type="submit"]'); 
     var progressBar = $("<div class='bar'></div>"); 
     var barContainer = $("<div class='progress'></div>").append(progressBar); 
     fileInput.after(barContainer); 
     fileInput.fileupload({ 
      fileInput:  fileInput, 
      url:    $('#upload_data').data('url'), 
      type:   'POST', 
      autoUpload:  true, 
      formData:   $('#upload_data').data('form-data'), 
      paramName:  'file', // S3 does not like nested name fields i.e. name="user[avatar_url]" 
      dataType:   'XML', // S3 returns XML if success_action_status is set to 201 
      replaceFileInput: false, 
      progressall: function (e, data) { 
      var progress = parseInt(data.loaded/data.total * 100, 10); 
      progressBar.css('width', progress + '%') 
      }, 
      start: function (e) { 
      submitButton.prop('disabled', true); 

      progressBar. 
       css('background', 'green'). 
       css('display', 'block'). 
       css('width', '0%'). 
       text("Loading..."); 
      }, 
      done: function(e, data) { 
      submitButton.prop('disabled', false); 
      progressBar.text("Uploading done"); 

      // extract key and generate URL from response 
      var key = $(data.jqXHR.responseXML).find("Key").text(); 

      // create hidden field 
      var input = $("<input />", { type:'hidden', name: fileInput.attr('name'), value: url }) 
      form.append(input); 
      }, 
      fail: function(e, data) { 
      submitButton.prop('disabled', false); 

      progressBar. 
       css("background", "red"). 
       text("Failed"); 
      } 
     }); 
     }); 
    }); 
    }); 

Серьезно Что я могу сделать, чтобы исправить это?

Answer 1

Я нашел проблему. Большое спасибо felixbuenemann a collaborator in jquery-fileupload-rails

Хотя это то, что я вижу в свойствах (он говорит Регион: Орегон), я должен использовать «нас-запад-2» в соответствии с этим Amazon region documentation

uploads_controller.rb теперь:

def new 
    @s3_direct_post = Aws::S3::PresignedPost.new(Aws::Credentials.new(ENV['AWS_S3_ACCESS_KEY_ID'], ENV['AWS_S3_SECRET_ACCESS_KEY']), 
               "us-west-2", ENV['AWS_S3_BUCKET'], { 
               key: '/uploads/object/test.test', 
               content_length_range: 0..999999999, 
               acl: 'public-read', 
               success_action_status: "201", 
               }) 
    @upload = Upload.new 
end 

Answer 2

Я предполагаю, что вы неправильно сконфигурировали название или маршрут вашего ведра. Ошибка исходит от Amazon, предупреждая, что нет маршрута DNS до https://bucketname.s3.oregon.amazonaws.com/.

Мне кажется, вам нужно установить фактическое bucketname к вашему имени ведро, а также падение Орегона из URL. Учитывая, что ваше ведро называется aymansalah, URL-адрес будет: https://aymansalah.s3.amazonaws.com/

Обзор Aws::Credentials документации и проверить переменные среды для достижения этого URL.