表单中的 dropzone - InvalidAuthenticityToken答案

【问题标题】：dropzone in a form - InvalidAuthenticityToken表单中的 dropzone - InvalidAuthenticityToken
【发布时间】：2017-02-13 09:06:15
【问题描述】：

我正在使用拖放区作为表单的一部分。 IE。除了 dropzone 字段之外，该表单还有其他元素。此外，表单提交后没有加载新视图，只有一些 js 代码，所以 remote = true。表格如下所示：

<%= form_tag submit_form_path, method: "POST", "data-abide" => "", 'autocomplete' => 'off', id: "id-of-form", remote: true, multipart: true do %>

<div class="dropzone" id="myDropzone"></div>
<%= text_field_tag "name",     ....
<%= text_field_tag "number", "",  ....
<%= text_field_tag "email", "",   ....
<%= submit_tag "submit", id: "submit-button" ....

<% end %>

Dropzone.options.myDropzone = {
 url: '/submit_form',
 autoProcessQueue: false,
 uploadMultiple: true,
 parallelUploads: 5,
 maxFiles: 5,
 maxFilesize: 1,
 acceptedFiles: 'image/*',
 addRemoveLinks: true,
 init: function() {
    dzClosure = this; 

    // for Dropzone to process the queue (instead of default form behavior):
    document.getElementById("submit-button").addEventListener("click", function(e) {
        // Make sure that the form isn't actually being sent.
        e.preventDefault();
        e.stopPropagation();
        dzClosure.processQueue();
    });

    //send all the form data along with the files:
    this.on("sendingmultiple", function(data, xhr, formData) {
        formData.append("name", jQuery("#name").val());
        *the rest of the form elements*
    });
}

}

在提交表单时，我收到Can't verify CSRF token authenticity Completed 422 Unprocessable Entity in 2ms ActionController::InvalidAuthenticityToken

更新： 解决了无效的真实性令牌问题。但是，现在我收到 ActionView::MissingTemplate - Missing template 错误。在 dropzone 添加到表单之前。我成功地提交了表单并执行了一些 js 代码（submit_details.js.erb），而无需重新加载页面。

但现在它

Processing by XyzController#submit_details as JSON

和

ActionView::MissingTemplate - Missing template xyz/submit_details, application/submit_enquiry with {:locale=>[:en], :formats=>[:json], :variants=>[], :handlers=>[:erb, :builder, :raw, :ruby, :coffee, :arb, :jbuilder]}.

控制器：

我把所有的东西都注释掉了，功能也只是

def submit_enquiry 
   #commented stuff
   puts "checking "
   respond_to do |format|          
    format.html    
    format.js
    format.json { render :json => true } 
   end
end

日志是：

于 2016-10-05 14:28:00 +0800 为 127.0.0.1 开始 POST "/submit_form"

14:28:00 web.1 |由 XyzController#submit_details 处理为 JSON

14:28:00 web.1 |参数：{"firstname"=>"something", "lastname"=>"something", "file"=>{"0"=>#, @original_filename="filename.png", @content_type="image/png ", @headers="Content-Disposition: form-data; name=\"file[0]\"; filename=\"filename.png\"\r\nContent-Type: image/png\r\n"> }, "语言"=>"en"}

14:28:00 web.1 |检查

14:28:00 web.1 | 2ms 内完成 406 Not Acceptable 14:28:00 web.1 | 14:28:00 web.1 | ActionController::UnknownFormat - ActionController::UnknownFormat:

【问题讨论】：

标签： jquery ruby-on-rails forms dropzone.js

【解决方案1】：

尝试将标头添加到您的 Dropzone 请求中

Dropzone.options.myDropzone = {
  url: '/submit_form',
  autoProcessQueue: false,
  ...
  headers: {
    'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
  }
}

【讨论】：

这解决了无效的真实性令牌问题。谢谢。请查看更新。
@sakshik12 这个答案可能会有所帮助stackoverflow.com/a/32915600/5306391
我查看了链接，但是无法同时响应js和json。我的控制器中有这个 - respond_to do |format| format.html format.js format.json { render :json => true } end...我可以在日志中看到请求，但之后它没有做任何事情。
@sakshik12 你愿意分享你的控制器吗？
@sakshik12 抱歉，我无能为力，我认为您应该将其放在另一个问题中，或者取消标记答案

【解决方案2】：

我希望我的所有 Dropzone 都能与我的设置（Rails 5、CSRF 令牌等）一起使用。所以我想出了一个 oneliner 放在咖啡脚本中 $ -> 之后：

 Dropzone.prototype.defaultOptions['headers'] = 'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')

【讨论】：

【解决方案3】：

找到解决方案：

在控制器中仅使用 json 响应。

所有你要执行的js代码，放在Dropzone.options里面：

this.on("success", function(file, responseText) {
   #js code
});

【讨论】：