File tree Expand file tree Collapse file tree 1 file changed +44
-1
lines changed
src/content/docs/zh-cn/reference/experimental-flags Expand file tree Collapse file tree 1 file changed +44
-1
lines changed Original file line number Diff line number Diff line change @@ -325,6 +325,49 @@ import { Font } from 'astro:assets';
325325<Font cssVariable="--font-roboto" preload />
326326```
327327
328+ ## 以编程方式访问字体数据
329+
330+ ` getFontData() ` 函数旨在通过编程方式获取更底层的字体数据,例如在 [ API 路由] ( /zh-cn/guides/endpoints/#服务器端点api-路由 ) 中使用,或用于生成自定义的元标签。
331+
332+ ### ` getFontData() `
333+ <p >
334+
335+ ** 类型:** ` (cssVariable: CssVariable) => FontData[] ` <br />
336+ <Since v = " 5.14.0" />
337+ </p >
338+
339+ 返回与指定 [ ` cssVariable ` ] ( #cssvariable-1 ) 对应的 ` FontData ` 对象数组,每个对象包含 ` src ` 、` weight ` 和 ` style ` 属性。
340+
341+ 以下示例演示了在使用 [ satori] ( https://github.com/vercel/satori ) 生成 OpenGraph 图片时,如何通过 ` getFontData() ` 从 URL 获取字体缓冲区数据:
342+
343+ ``` tsx title="src/pages/og.png.ts" "getFontData(\" --font-roboto\" )" "data[0].src[0].url"
344+ import type { APIRoute } from " astro"
345+ import { getFontData } from " astro:assets"
346+ import satori from " satori"
347+
348+ export const GET: APIRoute = (context ) => {
349+ const data = getFontData (" --font-roboto" )
350+
351+ const svg = await satori (
352+ <div style = { { color: " black" }} >hello, world</div >,
353+ {
354+ width: 600 ,
355+ height: 400 ,
356+ fonts: [
357+ {
358+ name: " Roboto" ,
359+ data: await fetch (new URL (data [0 ].src [0 ].url , context .url .origin )).then (res => res .arrayBuffer ()),
360+ weight: 400 ,
361+ style: " normal" ,
362+ },
363+ ],
364+ },
365+ )
366+
367+ // ...
368+ }
369+ ```
370+
328371## 字体配置参考
329372
330373所有的字体属性都必须在 Astro 配置文件中进行配置。有些属性对于远程和本地字体来说是通用的,而其他属性则根据你选择的字体提供商提供。
@@ -800,4 +843,4 @@ export default defineConfig({
800843
801844## 延伸阅读
802845
803- 有关此实验性 API 的全部详细信息或需提供反馈,请参见 [字体 RFC](https://github.com/withastro/roadmap/blob/rfc/fonts/proposals/0052 -fonts.md)。
846+ 有关此实验性 API 的全部详细信息或需提供反馈,请参见 [字体 RFC](https://github.com/withastro/roadmap/blob/rfc/fonts/proposals/0055 -fonts.md)。
You can’t perform that action at this time.
0 commit comments