Rails с Uppy XHRUpload: как получить @model в параметрах ha sh? - PullRequest
Новая
       17

Rails с Uppy XHRUpload: как получить @model в параметрах ha sh?

0 голосов
/ 28 марта 2020

Я пытаюсь получить Uppy jiving с помощью формы загрузки Rails, но у меня возникают проблемы с ее правильной настройкой. В результирующих параметрах ha sh отсутствует начальный :image объект. В типичной форме Rails я предполагаю, что об этом заботятся всякий раз, когда он связан с экземпляром модели. Но я не уверен, как сделать что-то подобное с помощью Uppy.

Просто мысли вслух, но, может быть, это как-то связано с тем, как я устанавливаю параметр endpoint?

РЕДАКТИРОВАТЬ: И чтобы уточнить, я просто пытаюсь получить он настроен для среды разработки, использует localhost:3000 и на данный момент хранит все локально

Вот "стандартная" форма Rails (без Uppy): 

<%= form_for @image, html: { multipart: true } do |f| %>
  <%= render 'shared/error_messages', object: f.object %>

  <div class="field">
    <%= f.label :file %><br>
    <%= f.file_field :file %>
  </div>
  <div class="actions">
    <%= f.submit "Upload Images" %>
  </div>
<% end %>

И получающиеся в результате параметры ha sh: 

=> <ActionController::Parameters {"utf8"=>"✓", "authenticity_token"=>"Cr9NAN6NE9JV6HrI7RE7EmjmxqnlfbWk+LT5k9yLuq1Sm0L9E/zJ/eXCDcjbyw7A6lUHP2LFBqbfjY+SWoeO+w==", "image"=>{"file"=>#<ActionDispatch::Http::UploadedFile:0x000055d297d74168 @tempfile=#<Tempfile:/tmp/RackMultipart20200328-12356-1qjsycd.png>, @original_filename="Screenshot from 2019-07-22 04-24-23.png", @content_type="image/png", @headers="Content-Disposition: form-data; name=\"image[file]\"; filename=\"Screenshot from 2019-07-22 04-24-23.png\"\r\nContent-Type: image/png\r\n">}, "commit"=>"Upload Images", "controller"=>"images", "action"=>"create"} permitted: false>

А вот моя попытка использовать форму Uppy: 

<%= form_for @image, html: { id: "uppy-form" } do |f| %>
  <%= render 'shared/error_messages', object: f.object %>

  <%= f.hidden_field :file, multiple: true, name: "images[file]", value: @image.file_data,
    accept: 'image/jpg,image/jpeg,image/gif,image/png,image/tif,image/tiff', class: "upload-hidden" %>

  <%= hidden_field_tag :authenticity_token, form_authenticity_token, id: :form_token %>
<% end %>

<script>
  const XHRUpload = Uppy.XHRUpload

  var uppy = Uppy.Core()
    .use(Uppy.Dashboard, {
      inline: true,
      target: '#uppy-form'
    })
    .use(XHRUpload, {
      endpoint: '/images',
      fieldName: 'images[file]'
    })
    .setMeta({
      authenticity_token: $("#form_token").attr('value')
    })

  uppy.on('complete', (result) => {
    console.log(`Upload complete! We've uploaded these files:`, result.successful)
  })
</script>

Получившаяся ошибка при вызове $ params

Completed 400 Bad Request in 5328ms (ActiveRecord: 0.4ms | Allocations: 40383)
ActionController::ParameterMissing - param is missing or the value is empty: image:

И параметры в полном объеме 

=> <ActionController::Parameters {"authenticity_token"=>"CYUz9AszYR4G0WEiI4bDoOlUyH4jFMzAVRf4vF6m6OJRoTwJxkK7Mbb7FiIVXPZya+cJ6KSsf8JyLo692KrctA==", "relativePath"=>"null", "name"=>"Screenshot from 2019-07-10 06-34-34.png", "type"=>"image/png", "exifdata"=>"[object Object]", "images"=>{"file"=>#<ActionDispatch::Http::UploadedFile:0x000055d2962c49d0 @tempfile=#<Tempfile:/tmp/RackMultipart20200328-12359-1d093y1.png>, @original_filename="Screenshot from 2019-07-10 06-34-34.png", @content_type="image/png", @headers="Content-Disposition: form-data; name=\"images[file]\"; filename=\"Screenshot from 2019-07-10 06-34-34.png\"\r\nContent-Type: image/png\r\n">}, "controller"=>"images", "action"=>"create"} permitted: false>

В ImagesController Вот как определяется image_params. Это тот начальный .require(:image), который, я думаю, отсутствует при отправке: 

def image_params
  params.require(:image).
    permit(...)
end

1 Ответ

0 голосов
/ 28 марта 2020

Понял!

Если в fieldName

была опечатка, у меня раньше было images[file], должно быть image[file]

...