More from Henry Kim

RSS

Handle 401 responses in Turbo by forcing a full redirect

11459 views

0 comments

                  class Api::BaseController < ActionController::API
  rescue_from Devise::MissingWarden do
    head :unauthorized
  end
end

                  import { Turbo } from "@hotwired/turbo-rails"

document.addEventListener("turbo:before-fetch-response", (event) => {
  const res = event.detail.fetchResponse
  if (res.statusCode === 401) {
    event.preventDefault()
    Turbo.visit("/members/sign_in")
  }
})

When a session expires, Turbo can end up swapping a login page into a frame, which is confusing. A practical fix is to detect 401 responses on the client and trigger a full-page visit (Turbo.visit) to the login URL. This keeps the app consistent and avoids nested login forms. I still prefer server-side solutions first (returning Turbo-Location headers), but a small client hook can cover edge cases like API-like endpoints that return 401. The key is to be surgical: only intercept 401 and only for HTML responses. You don’t want to break legitimate errors. Once in place, it removes a class of “it’s stuck in a frame” support tickets.

Henry Kim

More from Henry Kim

Handle 401 responses in Turbo by forcing a full redirect

0 Comments

More from Henry Kim