From e2cc7c11440ce7bf31fffd0697982332e28d729d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B4=AE=E7=94=9F=EF=BC=88=E5=AD=90=E8=99=9A=EF=BC=89?= <2234839456@qq.com> Date: Thu, 9 Apr 2026 11:56:10 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E5=89=8D=E7=AB=AF=E6=A0=BC=E5=BC=8F?= =?UTF-8?q?=E9=80=89=E6=8B=A9=E5=99=A8=E7=BB=84=E4=BB=B6=EF=BC=8C=E6=9C=8D?= =?UTF-8?q?=E5=8A=A1=E7=AB=AF=E6=94=AF=E6=8C=81=E8=83=BD=E5=8A=9B=E9=80=8F?= =?UTF-8?q?=E4=BC=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 新增 FontSelector.tsx 独立组件，字体和输出格式并排选择 - /api/config 新增 supportedOutTypes 字段（LLRT 仅 ttf） - 前端加载配置后自动适配可用格式 Co-Authored-By: Claude Opus 4.6 --- backend/app.ts | 3 ++ package.json | 2 +- src/App.tsx | 38 +++++++------- src/FontSelector.tsx | 118 +++++++++++++++++++++++++++++++++++++++++++ src/api.ts | 1 + 5 files changed, 143 insertions(+), 19 deletions(-) create mode 100644 src/FontSelector.tsx diff --git a/backend/app.ts b/backend/app.ts index 0147a22..b654582 100644 --- a/backend/app.ts +++ b/backend/app.ts @@ -199,11 +199,14 @@ async function handleListFonts(req: Request, res: Response) { /** GET /api/config — 返回公开配置 */ async function handleGetConfig(req: Request, res: Response) { + const isLlrt = release_name === "llrt"; return { req, res: jsonResponse({ enableTempUpload, adminUploadEnabled: !!adminApiKey, + /** LLRT 不支持 wasm，无法输出 woff2 */ + supportedOutTypes: isLlrt ? ["ttf"] : ["woff2", "ttf"], }), }; } diff --git a/package.json b/package.json index f0b7bc6..60847d2 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "webfont", "private": true, - "version": "1.3.1", + "version": "1.3.2", "type": "module", "scripts": { "dev": "pnpx tsx scripts/dev-all.ts", diff --git a/src/App.tsx b/src/App.tsx index 568494c..e9e253b 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,6 +1,7 @@ import { createMemo, createSignal, onMount, Show, For } from "solid-js"; import { fetchFonts, fetchConfig, type FontInfo, type ServerConfig } from "./api"; import UploadSection from "./UploadSection"; +import { SelectorRow } from "./FontSelector"; const s = { wrap: { @@ -92,9 +93,11 @@ function App() { const [text, set_text] = createSignal("天地无极，乾坤借法"); const [fonts, set_fonts] = createSignal([]); const [selectedFont, set_selectedFont] = createSignal(""); + const [outType, set_outType] = createSignal<"woff2" | "ttf">("woff2"); const [serverConfig, set_serverConfig] = createSignal({ enableTempUpload: false, adminUploadEnabled: false, + supportedOutTypes: ["woff2", "ttf"], }); const SLOGAN = "如清风似闪电，超级快的字体子集化裁剪"; @@ -103,6 +106,10 @@ function App() { const [fontList, config] = await Promise.all([fetchFonts().catch(() => []), fetchConfig().catch(() => ({ enableTempUpload: false, adminUploadEnabled: false }))]); set_fonts(fontList); set_serverConfig(config); + /** 服务端不支持当前 outType 时自动回退 */ + if (!config.supportedOutTypes?.includes(outType())) { + set_outType(config.supportedOutTypes?.[0] || "ttf"); + } if (fontList.length > 0) { /** 标语随机使用一个字体展示 */ const randomFont = fontList[Math.floor(Math.random() * fontList.length)]; @@ -123,10 +130,11 @@ function App() { const cssStyle = createMemo(() => { const font = selectedFont(); + const ot = outType(); if (!font) return ""; return `@font-face { font-family: "CustomFont"; - src: url("${location.origin}/api?font=${font}&text=${encodeURIComponent(text())}&outType=woff2") format("woff2"); + src: url("${location.origin}/api?font=${font}&text=${encodeURIComponent(text())}&outType=${ot}") format("${ot}"); } .custom-font { color: red; @@ -189,21 +197,14 @@ function App() {

{SLOGAN}

- - +
@@ -228,9 +229,10 @@ function App() {