Heroku部署Rails 6.1应用仅移动端点击Devise注册链接加载失败 桌面端正常

对应问题场景的根因与修复 #

• Turbo 预取的移动端兼容问题
  Rails 6.1 默认开启的Turbo 会在用户手指触碰链接、鼠标悬停的阶段，就后台预拉取目标页面的内容。移动端Chrome、Safari 对预取请求的响应缓存校验比桌面端严格很多：当预取请求携带的会话上下文触发Heroku 路由层的缓存拦截时，浏览器会直接把预取结果判定为无效响应，终止后续正式导航，表现为页面闪一下就报加载错误。
  快速验证：给「apply」入口链接临时关闭Turbo 预取，测试是否恢复正常：

  <%= link_to "申请", apply_path, data: { turbo: false } %>
  

• 路由映射重叠触发的重定向循环
  当前路由配置存在路径映射重叠：devise_for :users, controllers: { registrations: 'users/registrations' } 已经自动生成了指向自定义注册控制器的默认注册路由，后续在devise_scope 内单独定义的get "apply", to: "users/registrations#new" 会和默认路由的会话存储逻辑冲突。
  移动端浏览器的SameSite Cookie 策略默认比桌面端更严格，从登录页点击跳转时携带的上一个会话cookie，会让Devise 的store_location 逻辑错误判定跳转路径的权限，触发无感知的重定向循环，最终被移动端浏览器强制断开连接报错；直接在地址栏输入URL 属于全新的会话上下文，不会触发这层校验，因此可以正常打开页面。
  修复方式：在自定义注册控制器的new 动作中，跳过会话存储的重定向校验：

  class Users::RegistrationsController < Devise::RegistrationsController
    def new
      session.delete(:user_return_to)
      super
    end
  end
  

• Heroku 路由层的连接配额拦截
  站内点击跳转的请求会复用移动端浏览器的长连接通道，Heroku 对同一条长连接的并发请求数有严格限制，Turbo 的后台预取会占用掉一个请求配额，导致正式导航请求被拦截返回连接错误；直接在地址栏输入URL 会触发浏览器新建独立长连接，不受这个配额限制，因此加载正常。
  这类问题可以通过精简页面资源体积、降低预取请求的带宽占用缓解。

内容的提问来源于stack exchange，提问作者Sean B