时间戳

首页 > 解决方案 > 在 SvelteKit 中使用 JWT 进行服务器端授权

sveltekit - 在 SvelteKit 中使用 JWT 进行服务器端授权

问题描述

我在向服务器发送 JWT 令牌并使用它来授权load处理程序中的访问时遇到问题。我在客户端上使用 Firebase 进行身份验证。登录 ( onAuthStateChanged) 后，我向端点发送POST带有令牌的请求：/api/login

  export async function post(req) {    
    const idToken = req.headers['authorization']
    try {
        const token = await firebase().auth().verifyIdToken(idToken)
        req.locals.user = token.uid
    } catch (e) {
        console.log(e)
        return {
            status: 500,
            body: 'forbidden',
        }
    }
    
    return {
        status: 200,
        body: 'ok',
    }
}

在hooks.js：

export function getSession(request) {
    return {
        user: request.locals.user
    }
}

export async function handle({ request, resolve }) {
    const cookies = cookie.parse(request.headers.cookie || '')
    request.locals.user = cookies.user

    const response = await resolve(request)

    response.headers['set-cookie'] = `user=${request.locals.user || ''}; Path=/; HttpOnly`

    return response
}

在load方法中：

export async function load({ session }) {
   if (!session.user) {
      return {
         status: 302,
         redirect: '/start'
      }
   }

   // ...
}

所有这一切都很好，除了登录后的任何客户端导航都被拒绝，因为session.user仍然是未定义的。通过在浏览器中键入 URL 进行导航时，它可以正常工作，之后客户端导航也可以工作。

任何想法为什么和做什么？

标签： sveltekit

解决方案

我已经通过在用户登录后登陆的任何页面上添加浏览器重新加载来解决这个问题。客户端重新加载处理来自登录 API 端点的成功响应的片段如下所示

if (sessionLoginResponse?.status === "success") {
            await signOut(auth);
            window.history.back();

            setTimeout(() => {
              window.location.reload();
            }, 10);
          }

推荐阅读