[Bug] 插件详情页“文档”标签中，README 的相对路径图片无法加载

Aperta
  • Qualcosa non va?
#27 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
3/5
Tempo stimato
Mezza giornata
Idoneità per principianti
50/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
html
Ambito
frontend

Direzione di ricerca

Start in the MarkdownContent component, where the relative-path rewrite to raw.githubusercontent.com already runs for the source branch but not for the non-empty html branch that only goes through DOMPurify. Reuse that resolver on img[src] and a[href] in the html path, then check a plugin page such as meme_manager with its docs tab. Done when relative image paths in readme_html load from GitHub and absolute URLs are left unchanged.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

问题概述 / Summary

插件 README 中使用仓库相对路径引用的图片（如 <img src="docs/preview.png">、![预览](docs/preview.png)），在 GitHub 上能正常显示，在 AstrBot Cloud 插件详情页的“文档”标签中显示为加载失败。

前端 MarkdownContent 组件已有相对路径解析逻辑：把相对地址改写为 https://raw.githubusercontent.com/{owner}/{repo}/{git_commit}/{path}。但这段逻辑只在渲染 Markdown 源文（source）时执行。插件详情接口返回非空 readme_html 时，组件只对 readme_html 做 DOMPurify 清洗后直接渲染，不经过相对路径解析。readme_html 中的相对路径因此原样保留，浏览器按页面地址把它解析为 https://cloud.astrbot.app/plugin/{owner}/{path}，该地址返回 404（text/html）。

复现步骤 / Steps to reproduce

  1. 打开以下任一插件详情页的“文档”标签，它们的 README 都用仓库相对路径引用图片：
  2. 这些图片显示为加载失败；同一 README 在 GitHub 上正常显示。
  3. 对照接口 GET /api/v1/market/plugins/{slug}：readme 与 readme_html 中这些图片的 src 都保持相对路径。

按市场列表接口统计，前 300 个插件中有 53 个在 README 中用相对路径引用图片，它们的 readme_html 都非空，均受影响。

期望行为 / Expected behavior

readme_html 中的相对 img src（以及相对 a href）与 Markdown 源文路径一样，按插件仓库和收录提交解析为 GitHub 地址，图片正常显示。

实际行为 / Actual behavior

图片显示为加载失败；请求地址为 https://cloud.astrbot.app/plugin/{owner}/{相对路径}，返回 404（text/html）。文件是否打包在插件 zip 中没有区别，例如插件根目录下的 logo.png 同样 404。

相关页面或资源链接 / Related URL

  • 上述 4 个插件详情页（见复现步骤）。
  • 前端组件 MarkdownContent：html 非空时只调用 DOMPurify 清洗；相对路径解析只在渲染 source 的分支中执行。

AstrBot Cloud 版本或环境 / Version or environment

线上 https://cloud.astrbot.app，2026-11-01；桌面浏览器。

日志、截图或其他上下文 / Logs, screenshots, or context

可能的修复方式：在 html 分支清洗前后，对 img[src] 与 a[href] 复用现有的相对路径解析函数；或在服务端生成 readme_html 时传入仓库上下文，让 GitHub 渲染结果中的相对路径变成绝对地址。

插件作者目前的规避方式是把 README 图片改成绝对地址。

提交前确认 / Checklist

  • 我已搜索现有 issue，确认没有重复反馈。 / I searched existing issues and found no duplicate.
  • 我已移除反馈中的密码、Token、Cookie 等敏感信息。 / I removed passwords, tokens, cookies, and other sensitive information.
Lingua principale
Nessun dato sulla lingua
Stelle
6
Fork
0
Nessuna PR unita negli ultimi 30g

Preparare l'ambiente

Questo progetto non fornisce container di sviluppo, Dockerfile né guida per i contributori, quindi l'ambiente è a tuo carico: parti dal suo README e consulta la nostra guida al primo contributo per i passaggi generali.

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di AstrBotDevs/astrbot-cloud-issues

Tutte le issue di AstrBotDevs/astrbot-cloud-issues

Issue simili

Altre issue su Web Dev

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.