Rails 4: Как загрузить файлы с помощью AJAX

Я хочу загрузить файлы с помощью AJAX. Раньше я достигал этого, используя магический jQuery form plugin, и он отлично работал. В настоящее время я создаю приложение Rails и пытаюсь сделать что-то "Rails Way", поэтому я использую Form Helper и жемчуг paperclip для добавления вложений файлов.

rails docs предупреждают, что Form Helper не работает для загрузки файлов AJAX:

В отличие от других форм, создающих асинхронную форму загрузки файлов, это не так. просто как предоставление form_for с remote: true. С формой Ajax Сериализация выполняется с помощью JavaScript, выполняющегося внутри браузера, и поскольку JavaScript не может читать файлы с вашего жесткого диска файл не могут быть загружены. Наиболее распространенным решением является использование невидимого iframe, который служит целью для отправки формы.

Кажется очевидным, что нет готового решения. Поэтому мне интересно, что самое умное. Похоже, у меня есть несколько вариантов:

Используйте хелпер формы и трюк iframe.
Используйте форму helper + load jQuery form plugin для отправки файла (не уверен, что это будет хорошо играть с маркером аутентификации Rails и т.д.).
Используйте форму helper + paperclip + [какой-либо другой камень], чтобы расширить его функциональность, чтобы разрешить отправку формы AJAX.

Все три кажутся возможными. Я знаю меньше всего о №3, в частности о части [какой-то другой драгоценности]. Я нашел два похожих вопроса (this и this), в которых упоминается филиал Pic-Upload под названием Uploadify, но те 2 года и имеют дело с Rails 2 и 3 (и Uploadify не обновлялся годами). Поэтому, учитывая, насколько сильно изменилось, я думаю, что это действительно новый вопрос:

Какой лучший способ загрузить файлы с AJAX в Rails 4?

Ответ 2

IMHO Rails не идеальна при работе с загрузкой файлов с использованием AJAX, особенно если вы хотите индикатор выполнения. Мое предложение - использовать Javascript для отправки формы по запросу AJAX, как вы указали в (2). Если вам нравится Javascript, у вас не будет много проблем.

Недавно я использовал тот же подход, используя эту очень простую библиотеку JS https://github.com/hayageek/jquery-upload-file, и я написал более подробную информацию здесь http://www.alfredo.motta.name/upload-video-files-with-rails-paperclip-and-jquery-upload-file/

Для приложения с формой для загрузки фильма с заголовком и описанием код JS выглядит следующим образом:

$(document).ready(function() {
  var uploadObj = $("#movie_video").uploadFile({
    url: "/movies",
    multiple: false,
    fileName: "movie[video]",
    autoSubmit: false,
    formData: {
      "movie[title]": $('#movie_title').text(),
      "movie[description]": $('#movie_description').text()
    },
    onSuccess:function(files,data,xhr)
    {
      window.location.href = data.to;
    }
  });

  $("#fileUpload").click(function(e) {
    e.preventDefault();
    $.rails.disableFormElements($($.rails.formSubmitSelector));
    uploadObj.startUpload();
  });
});

От совершенства, но дает вам гибкость в вашем интерфейсе.

Ответ 1

Ответ 2