如果未登录，如何将用户重定向到登录页面

Posted 2023-02-15

【中文标题】如果未登录，如何将用户重定向到登录页面

【英文标题】：How to redirect user to sign in page if not logged in

【发布时间】：2021-12-23 07:13:47

【问题描述】：

如果用户尝试访问 MyAccountController，我会尝试将用户重定向到登录页面。现在的问题是登录路由是在 router.js 中定义的，我无法找到在 rails 控制器中访问 vue 路由的方法。

class MyAccountController < ApplicationController
  before_action :authenticate_user!
  before_action :require_user

  private

  def require_user
    head(401) unless user_signed_in?
  end

  def authenticate_user
   if user_signed_in?
      super
    else
      redirect_to 'sign-in'
    end
  end   
end

路由器.js

const SessionsVue = () => import('views/sessions/new.vue')

const routes = [
  'path': '/sign-in', component: SessionsVue, meta:  requiresAuth: true  
]

【问题讨论】：

vue 中的某个地方，您必须检查是否返回 HTTP 标头 = 401 我已经有一段时间没有使用 Vue，所以我无法进一步指导您，但有一些生命周期钩子也许您可以使用....

【参考方案1】：

您无法在 Rails 控制器中访问 Vue 路由。 Vue 代码就是在浏览器中运行的 javascript 代码，它通过 HTTP 请求和响应与 Rails 控制器通信。

从这里开始，您可以选择如何以某种方式从控制器与浏览器中运行的 JS 进行通信。

你没有太多选择：

响应状态 响应标头 响应正文

响应状态对应于predefined messages。有一种状态非常适合您：401 Unauthorized。你可以

head :unauthorized

从一个动作并以某种方式检查 Vue 中的响应状态。

响应标头和正文没有太大区别：标头始终传输一个键/值表，对于正文，您可以传递任何字符串，但对于 Vue，您通常会选择带有 JSON 的字符串，这是一个表键/值也是如此。

你可以通过一个

 errors: ["Unauthorized"], ok: false 

在正文中并以某种方式在 Vue 中检查这些值。