(五)SvelteKit教程:错误页和重定向
设置404页面和重定向非常容易,我们还是在 /about 目录下学习这个知识,文件结构如下:
├── +layout.svelte
├── +page.svelte
├── about
│ └── [aboutID]
│ ├── +error.svelte
│ ├── +page.server.js
│ └── +page.svelte
我们需要修改 +page.server.js 文件,内容如下:
import { error,redirect } from '@sveltejs/kit';
export const load = async (serverloadEvent) => {
const { fetch, params, url, route} = serverloadEvent;
console.log("About page load", params, url, route.id);
const { aboutID } = params;
if (aboutID == "22") {
throw redirect(307, "/");
}
if (aboutID > "2") {
throw error(404, {message: "Invalid aboutID message"});
}
const title = "New, from server";
const response = await fetch(`http://localhost:4000/users/${aboutID}`);
const users = await response.json();
return {
title,
users,
};
};
重定义非常容易,在代码中,当 aboutID == 22 的时候,我们就直接重定义到根目录下面。404 也非常容易,当aboutID > 2 时候,我们直接是定义到错误页 error。
接下来,我们需要写 +error.svelte 内容如下:
<script>
import { page } from '$app/stores';
</script>
{$page.status}: {$page.error.message}