簡體   English   中英

Ruby on Rails:使用AJAXified表格找出406錯誤/缺少重定向

[英]Ruby on Rails: Figuring out 406 error / lack of redirect with AJAXified form

我有一個帶有“ Article”支架的項目-其中包括縮略圖的回形針文件字段-團隊中的其他人抱怨提交表單時必須如何再次將文件添加到字段中,並且驗證錯誤是由於缺少另一個字段上的數據而觸發。

考慮到這是由於瀏覽器的限制所致,我在表單中添加了一個remote => true以及一個error.js.erb文件,從而確定了如果不必重新加載頁面的情況下文件字段仍然存在。 不幸的是,事實並非如此,因為我讀到出於安全原因,瀏覽器無法通過AJAX處理多部分表單/文件。 但是,我隨后發現了Remotipart寶石 ,可以解決此問題。 因此,應用程序的相關部分如下所示:

_form.html.erb

<%= form_for(@article, :html => { :multipart => true }, :remote => TRUE) do |f| %>
  <div id="errors"></div>
  <%= f.text_field :title %>
  <%= f.text_area :body %>
  <%= f.file_field(:photo) %>
  <%= f.submit %>
<% end %>

article_controller.rb (創建操作)

  def create
    @article = Article.new(params[:article])

    respond_to do |format|
      if @article.save
        format.html { redirect_to(@article, :notice => 'Article was successfully created.') }
        format.xml  { render :xml => @article, :status => :created, :location => @article }
      else
        format.html { render :action => "new" }
        format.xml  { render :xml => @article.errors, :status => :unprocessable_entity }
        format.js { render 'errors', :locals => { :item => @article } }
      end
    end
  end

errors.js.erb

<%= remotipart_response do %>
    $("#errors").empty().append('<div id="error_explanation"><h2><%= pluralize(item.errors.count, "error") %> prohibited this article from being saved:</h2><ul></ul></div>');
    <% item.errors.full_messages.each do |msg| %>
        $("#error_explanation ul").append("<li><%= escape_javascript(msg) %></li>");
    <% end %>
<% end %>

因此,基本上,如果存在驗證錯誤,那么js文件會將這些錯誤添加到表單上的錯誤div上。 此外,如果填寫了文件字段,則該字段仍然存在。所有工作都可以:它確實在數據庫中創建了內容並上傳了文件,或者在某些驗證失敗的情況下拋出了錯誤而不會丟失文件字段,但是仍然存在一個問題。

提交表單並上傳文件時,我的日志中出現406不允許錯誤,而沒有重定向到顯示頁面。 如果表單沒有上載文件,則日志將返回200 OK,但是頁面也不會重定向到show操作。

在Google和其他SO線程上搜尋之后,我發現這部分代碼應該可以將其傳遞給正確的標頭(是的,jQuery已安裝並在application.js之前運行)...

application.js

jQuery.ajaxSetup({ 
  'beforeSend': function(xhr) {xhr.setRequestHeader("Accept", "text/javascript")}
})

...不幸的是,它不起作用。 我沒有任何想法,關於如何解決406問題並使其正確重定向的任何建議?

我認為您這樣做太復雜了,為什么不集中精力防止用戶在出現錯誤后再次上傳文件。 用戶繼續以他們快樂的方式前進,而您不必為丑陋的JavaScript黑客所困擾。

存儲文件,然后將用戶重定向到填寫了文件字段的創建頁面。

直到現在還沒有解決這個問題,但是我終於解決了這個問題。 首先,我刪除了application.js代碼。 其次,通過在response_to的保存成功中包含format.js解決了406重定向的問題。

respond_to do |format|
  if @article.save
    format.js
    format.html { [...] }
  else
    [...]
  end
end

唯一的問題是,即使將redirect_to放置在format.js中,頁面也根本不會重定向。 它確實觸發了一個create.js.erb文件,所以在其中,我放了...

window.location.replace("/articles");

...以在加載create.js.erb時啟動重定向。 我希望它通過控制器進行響應和重定向,而不是通過JavaScript進行重定向,但是我還沒有看到針對此問題的有效解決方案(我研究過的涉及request.xhr代碼的所有其他方法都根本無效)。 但這有效。

但是,這樣做的另一個好處是,我可以通過節省文章來提高創意,例如在重定向到文章索引之前預覽“顯示”頁面幾秒鍾,等等。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM