Dropzone.js ActionController::ParameterMissing 个人资料图片上传答案

【问题标题】：Dropzone.js ActionController::ParameterMissing profile image uploadDropzone.js ActionController::ParameterMissing 个人资料图片上传
【发布时间】：2018-01-08 05:48:17
【问题描述】：

我正在尝试将 Dropzone.js 实现为用户脚手架的拖放个人资料照片上传器

在我的 ruby on rails 中，我创建了user 脚手架，它有一张个人资料照片（实现由 PaperClip 处理）。

我想创造一种体验

用户编辑同一页面上的所有详细信息（包括个人资料照片）
在第一次加载edit/user/x页面时，当前图像被加载；
当用户将图像拖放到表单部分时，图像将呈现为预览。
如果您点击取消，您之前的图像将被恢复。

我想出的方法是创建一个临时表Uploads 来存储所有放入 Dropzone 的图像/文件。上传成功后，会将图片的id返回给表单，用户点击保存后，图片的id会随表单一起发布，并建立用户与图片的链接。

我对堆栈溢出社区有 2 个问题：

我是否使这种方法过于复杂？
我收到以下错误： ActionController::ParameterMissing (param is missing or the value is empty: Upload):我做错了什么？

我目前拥有的代码概述如下。

感谢任何帮助。

<%= form_with(model: user, local: true) do |form| %>
<div class="form-group">
    <% if user.errors.any? %>
      <div id="error_explanation" class="row">
        <h2><%= pluralize(user.errors.count, "error") %> prohibited this user from being saved:</h2>
        <ul>
        <% user.errors.full_messages.each do |message| %>
          <li><%= message %></li>
        <% end %>
        </ul>
      </div>
    <% end %>
  <div class="field">
    <%= form.label :name %>
    <%= form.text_field :name, id: :user_name, :class=> "form-control" %>
  </div>
  <div id="profile-photo" class="field dropzone">
    <%= form.file_field :profile, :class=> "fallback"%>
  </div>

  <div class="field">
    <%= form.label :role %>
    <%= form.text_field :role, id: :user_role, :class=> "form-control" %>
  </div>

  <div class="actions">
    <%= form.submit %>
  </div>
</div>
<% end %>

我有以下 JavaScript

 $("#profile-photo").dropzone({
      url: '/uploads/upload',
      maxFiles: 1,
      maxfilesexceeded: function(file) {
          this.removeAllFiles();
          this.addFile(file);
      },
      success: function(file, response){
        alert("upload was successful");
      }
    });

下面的Controller#Action

# POST /uploads
    # POST /uploads.json
    def upload
      puts request.request_parameters
      @upload = Upload.new(upload_params)

        if @upload.save
           puts @upload.id
      #     format.html { redirect_to @upload, notice: @upload.id }
      #     format.json { render :show, status: :created, location: @upload }
          else
      #     format.html { render :new }
      #     format.json { render json: @upload.errors, status: :unprocessable_entity }
        end
    end

    def upload_params
      params.require(:Upload).permit(:photo)
    end

我的 request.request_parameters 如下所示：

Parameters: {"file"=>#<ActionDispatch::Http::UploadedFile:0x007f8fe120b278 @tempfile=#<Tempfile:/var/folders/rp/79zzx36504z9kp7srj55pxk80000gn/T/RackMultipart20170804-3814-13pid57.jpg>, @original_filename="tokyo.jpg", @content_type="image/jpeg", @headers="Content-Disposition: form-data; name=\"file\"; filename=\"tokyo.jpg\"\r\nContent-Type: image/jpeg\r\n">}

【问题讨论】：

嗨，安东尼！你曾经能够解决这个问题吗？我自己也遇到了类似的问题……

标签： ruby-on-rails-4 dropzone.js

【解决方案1】：

我怀疑这与 dropzone.js 文件用作 paramName 的内容有关。如果您打开 dropzone.js 文件，您将看到 paramName 值默认为“file”。

尝试将此行更新为如下所示：

paramName: 'user[profile]'（或者你设置了用户模型的文件字段属性，我只是从你的帖子中推断出来的，这里可能有误）

例如，在我的例子中，我的图像表有一个名为“文件”的列，它是上传图像的位置。一旦我将 paramName 更新为 'image[file]' ，一切都开始按预期工作，并且使用 POST 请求适当地填充了强参数。

【讨论】：