使用 Turbolinks 5 和 Rails 5 的页面之间重新加载资产

Assets are reloaded between pages with Turbolinks 5 and Rails 5

在我的生产环境中,我注意到 Turbolinks 没有在页面之间缓存资源。当我进入我的应用程序的第一页时,我的 javascript 包被加载,所以我的 CSS。当我到达另一个带有 link 的页面时,我可以在 chrome devtools 的网络选项卡中看到它们已重新加载(HTTP 代码 200)。

application.html.erb

<html>
<head>
    <title>My title</title>
    <meta name="description" content="My description">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="robots" content="index, follow">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

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

    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <%= csrf_meta_tags %>
    <%= action_cable_meta_tag %>
</head>
<body class="<%= body_user_class %> <%= controller.controller_name %>">
  // Stuff
</body>
</html>

application.js

//= require turbolinks
//= require jquery
//= require jquery.slick
//= require jquery-ui/sortable
//= require rails-ujs
//= require_tree ./components

资产的指纹在第一页和第二页之间保持相同,所以我认为问题不在于此。

我能理解为什么我的 bootstrap 资产被重新加载,因为它被引用为经典资源而不使用 rails。但是为什么我的应用程序的 js 和 css 重新加载了?

在您的应用程序 JavaScript 捆绑包中,您具有以下内容:

document.addEventListener("turbolinks:before-visit", function(e) {
  e.preventDefault(),
  window.location = e.data.url
})

这取消了默认的 Turbolinks 行为。如果您删除此事件侦听器,它应该会按预期工作。