How to redirect to page in SvelteKit?

在SvelteKit中，页面的重定向可以通过多种方式实现，主要取决于你希望在什么时候进行重定向。以下是几种常见场景和相应的实现方法：

1. 使用 goto 函数

在 SvelteKit 中，你可以使用导航辅助函数 goto 来实现客户端重定向。这是在用户交互后或某些条件满足时进行重定向的一种常见方式。

示例：

假设你在一个登录页，用户成功登录后，你希望将用户重定向到首页：

javascript
import { goto } from '$app/navigation';

async function login(username, password) {
  const response = await fetch('/api/login', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ username, password })
  });

  if (response.ok) {
    // 登录成功，重定向到首页
    goto('/');
  } else {
    console.error('登录失败');
  }
}

2. 在 load 钩子中重定向

如果你需要在页面加载时就决定是否重定向（例如基于用户的身份验证状态），你可以在页面的 load 函数中使用重定向。

示例：

假设你想根据用户是否登录来决定是否访问一个保护页面，如果未登录则重定向到登录页面：

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

  // 用户已登录，继续加载页面
  // 其他页面逻辑...
}

在这个示例中，我们检查 session 对象中是否有用户信息。如果没有，我们返回一个带有状态码 302 和重定向路径的对象。

3. 在 endpoint 中重定向

如果你在 API 端点处理逻辑（例如处理表单提交）时需要重定向，可以直接在 endpoint 中返回重定向响应。

示例：

javascript
export async function post(request) {
  const result = await someDatabaseOperation(request.body);

  if (result.success) {
    return {
      status: 303, // See Other
      headers: {
        location: '/success'
      }
    };
  } else {
    return {
      status: 303,
      headers: {
        location: '/error'
      }
    };
  }
}

在这个示例中，我们根据操作结果返回不同的重定向路径。状态码 303 表示响应为 See Other，通常用于 POST 请求后的重定向。

通过这些方法，你可以根据不同的应用场景和需求在 SvelteKit 应用中实现重定向。