【问题标题】:Rails 4: Turbolinks sends request twice and reloads the pageRails 4:Turbolinks 发送两次请求并重新加载页面
【发布时间】:2014-10-10 08:01:09
【问题描述】:

我正在使用 Rails 4.1.1 和 Ruby 2.1.0 开发 Ruby on Rails 应用程序。

我已将应用设置为使用 Turbolinks,这导致 AJAX 链接出现问题。当我单击调用 AJAX 函数的链接时,会发生三件事:
1. AJAX 调用
2.重新加载相同的链接
3. 应用服务器将所有请求运行两次。

如何使这些链接成为标准 AJAX 链接?

供参考,这里是我GemFile的相关部分:

gem 'turbolinks'
gem 'jquery-turbolinks'

这是我在application.js 中包含 JavaScript 库的方式:

//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require turbolinks

以下是我在应用程序布局中包含 JavaScript 文件的方式:

<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>

【问题讨论】:

    标签: javascript ruby ajax ruby-on-rails-4.1 turbolinks


    【解决方案1】:

    可能有 3 个原因:

    • 您对该请求的响应状态介于 400 到 600 之间
    • 您的回复内容类型不匹配/^(?:text\/html|application\/xhtml\+xml|application\/xml)(?:;|$)/
    • 资产已在新页面中更改。 例如,您在包含另一个 js 的不同布局中呈现新页面。当data-turbolinks-track 为真时,turbolinks 会进行刷新。

    这 3 个原因可以从下面的源代码中得到。当响应给出文档正文时,它会显示它,或者它会刷新页面。

    fetchReplacement = (url, onLoadFunction, showProgressBar = true) ->
      ...
      xhr.onload = ->
        triggerEvent EVENTS.RECEIVE, url: url.absolute
        if doc = processResponse()
          reflectNewUrl url
          reflectRedirectedUrl()
          changePage extractTitleAndBody(doc)...
          manuallyTriggerHashChangeForFirefox()
          onLoadFunction?()
          triggerEvent EVENTS.LOAD
        else
          document.location.href = crossOriginRedirect() or url.absolute
    
    processResponse = ->
      clientOrServerError = ->
        400 <= xhr.status < 600
    
      validContent = ->
        (contentType = xhr.getResponseHeader('Content-Type'))? and
          contentType.match /^(?:text\/html|application\/xhtml\+xml|application\/xml)(?:;|$)/
    
      ...
    
      //here is the check
      if not clientOrServerError() and validContent()
        doc = createDocument xhr.responseText
        if doc and !assetsChanged doc
          return doc
    

    【讨论】:

      【解决方案2】:

      尝试在您的表单中使用:onsubmit =&gt; "false",并使用点击功能运行您的提交。

      【讨论】:

        猜你喜欢
        • 2013-02-24
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多