feat(website): SEO 升级 — BrowserRouter + 每页独立 meta

- HashRouter → BrowserRouter(basename /KimiSwitch),GitHub Pages 用 404.html SPA 回退,/features /download /changelog 变为可收录的独立 URL
- 每页独立 title / description / OG / canonical(RouteMeta 随语言切换)
- og:image 改为绝对地址;sitemap 更新为干净路径
This commit is contained in:
KimiSwitch Dev committed 2026-08-01 19:56:54 +08:00
1 parent 5788624d12
commit 1b5cd0f416
8 files changed
+139 -21

No files matched your search

+46
View File
@@ -8,6 +8,10 @@ import Download from "./sections/Download";
import Privacy from "./sections/Privacy";
import CTA from "./sections/CTA";
import Footer from "./components/Footer";
import { useLang, type Dict } from "./i18n";
const SITE_URL = "https://billowliu2.github.io/KimiSwitch";
type SeoKey = keyof Dict["seo"];
function ScrollToTop() {
const { pathname } = useLocation();
@@ -17,6 +21,47 @@ function ScrollToTop() {
return null;
}
/** Update per-page title / description / OG / canonical for SEO. */
function RouteMeta() {
const { pathname } = useLocation();
const { t } = useLang();
useEffect(() => {
const page = pathname.replace(/\/+$/, "");
const seoKey: SeoKey =
page === "/features" || page === "/changelog" || page === "/download"
? (page.slice(1) as SeoKey)
: "home";
const m = t.seo[seoKey];
const url = `${SITE_URL}${page === "" ? "/" : page}`;
document.title = m.title;
setMeta("name", "description", m.description);
setMeta("property", "og:title", m.title);
setMeta("property", "og:description", m.description);
setMeta("property", "og:url", url);
setMeta("name", "twitter:title", m.title);
setMeta("name", "twitter:description", m.description);
const canon = document.querySelector('link[rel="canonical"]');
if (canon) canon.setAttribute("href", url);
}, [pathname, t]);
return null;
}
function setMeta(attr: "name" | "property", key: string, content: string) {
let el = document.head.querySelector<HTMLMetaElement>(
`meta[${attr}="${key}"]`,
);
if (!el) {
el = document.createElement("meta");
el.setAttribute(attr, key);
document.head.appendChild(el);
}
el.setAttribute("content", content);
}
const homePage = (
<>
<Hero />
@@ -30,6 +75,7 @@ export default function App() {
<Nav />
<main className="flex-1">
<ScrollToTop />
<RouteMeta />
<Routes>
<Route path="/" element={homePage} />
<Route