wait4xandGLM-5.3
280654f9e3
【T1 PDF 内置阅读重做】iframe 对 arXiv PDF 实测 ERR_ABORTED（浏览器 PDF
插件策略差异）→ pdfjs-dist 6.4.299 客户端 canvas 渲染：只在 /papers/
动态 import（worker ?url 打包，不进全站 bundle）；文档一次取回 + IO
懒渲染（rootMargin 400px）+ 页占位 aspect-ratio 防跳动 + 12s 首屏兜底 +
微信 UA 直接兜底；工具条页码/缩放/翻页/下载/arXiv/授权声明保留。红线：
PDF 由访客浏览器直取 arXiv（CORS * 实测），仓内零副本。真页实测：
13 页 canvas 全绘制、首屏墨迹像素非空、零 console 错误。
【T2 斜体排版 bug 真凶】global.css 的 `.prose-* p > em:only-child
{ display:block; text-align:center }` 图注样式按"斜体独占段"自动命中，
把所有正文独占段斜体变成块级居中。改：图注用显式 .fig-cap 驱动 + 补
em/i { display:inline; font-style:italic } 基线；media-sample 迁移新写法，
指南注明旧写法失效原因。实测独占段与行内斜体均 display:inline/italic。
【T3 评论"假挂载"真 bug】原 initArtalk 一进来就置 mounted=true——脚本
404/被拦截时把空容器误标已挂载，5s 兜底被绕过，正是"评论区一直空着"的
来源之一。改为库就绪才算成功；另加三触发路径（IO 主 + 锚点点击 + 滚到
页底 2s 兜底）、5s 失败提示+重试钮、软导航重挂、成功打
data-artalk-mounted=1 供 E2E。
【T4 文章排版类 + 安全白名单】11 个受限类（ink-1/2/3/muted/accent、
font-serif/kai/sans/mono、drop-cap、quote-line、fig-cap）全走 tokens 禁
任意 hex；新增 rehype-class-whitelist.ts：className 白名单 + 剥离 style
与 on*；实测注入用例只剩 class="ink-2"，style/onclick 全无。新坑入档：
markdown raw HTML 在 hast 是 type:'raw' 节点、白名单插件看不见 span，必须
先 rehype-raw 再过滤 → 插件链 [rehypeRaw, rehypeClassWhitelist,
rehypeLinkCards]。新依赖：pdfjs-dist、rehype-raw。
车道：op-artalk（T1 6/6、T2 2/2、T3 3/3、T4 6/6）；收编复验：build 46 页、
E2E 37/37、四专项 playwright 实测（PDF 13 canvas/斜体 inline/白名单净化/
评论 mounted 标记）
验证: node v26.13.0 + astro 7.4.4 构建 46 页 exit 0；E2E 37/37 PASS
Spec: none (阅读体验四件，车道级交付)
Co-authored-by: GLM-5.3
33 lines
1.3 KiB
Markdown
33 lines
1.3 KiB
Markdown
---
|
||
title: "媒体支持样例"
|
||
pubDate: 2026-10-25
|
||
category: tech
|
||
tags: [test, hidden]
|
||
# 视觉/管线测试样张：draft:true 会被 getStaticPaths 全链路过滤（无静态产物），
|
||
# 故用非 draft + hidden 标记保证 /archives/media-sample/ 产物存在；视觉测试完成后应删除本篇
|
||
draft: false
|
||
---
|
||
|
||
本篇为三媒管线样张：验证 markdown 图片、HTML5 视频/音频在构建链路中的处理，供视觉回归与多端适配测试使用（hidden 标记，勿收录）。
|
||
|
||
## 图片（markdown 语法，构建期经 sharp 优化）
|
||
|
||
|
||
|
||
<p class="fig-cap">图注新写法：fig-cap 类，photos 目录样片副本（1600×2400 竖幅）。</p>
|
||
|
||
## 视频（raw HTML，H.264 320×240，ffmpeg testsrc2 生成）
|
||
|
||
<!-- 视/音频走 public/media/ 绝对路径：raw HTML 相对引用不经打包器（曾实测 404），
|
||
与写作指南“大视频走仓外 store 的 /media/ 命名空间”对齐 -->
|
||
|
||
<video controls preload="metadata" width="320" height="240" src="/media/media-sample/sample-video.mp4"></video>
|
||
|
||
*原生 `<video>` 控件，无 JS；源文件 45KB，faststart 已开启。*
|
||
|
||
## 音频（raw HTML，440Hz 正弦波 mp3）
|
||
|
||
<audio controls preload="metadata" src="/media/media-sample/sample-audio.mp3"></audio>
|
||
|
||
*原生 `<audio>` 控件；源文件 18KB。*
|