security: Markdown preview loads remote images, and the site has no CSP

Chiusa
  • Qualcosa non va?
#142 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Una pull request collegata è già stata integrata.

  • #150 di @ajithakdev — integrata

Valutazione

Difficoltà
4/5
Tempo stimato
3-5 giorni
Idoneità per principianti
55/100
Tipo di issue
Funzionalità
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
react, typescript
Ambito
frontend, security

Direzione di ricerca

Start with src/tools/markdown/MarkdownTool.tsx and index.html, then inspect the build setup to learn how pages are generated and where the inline theme script comes from. Check how the preview and print window render sanitized Markdown, and how the API Tester makes requests. Done when remote images make no request before opt-in, the CSP appears on every generated page, and Home, a tool page, and About work without CSP console errors.

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

Descrizione

security

Problem

The Markdown tool renders a live preview with DOMPurify.sanitize(marked.parse(markdown)) (src/tools/markdown/MarkdownTool.tsx:14, inserted at line 98). DOMPurify blocks scripts, but it keeps <img src="https://...">. Pasting Markdown that contains a remote image, for example a tracking pixel in a copied README or email, makes the browser request that URL as soon as it renders. The print window does the same (MarkdownTool.tsx:20-40).

This conflicts with the project rule in AGENTS.md ("No network calls except the API Tester's user-initiated fetch") and the site's privacy promise. There is also no Content-Security-Policy in index.html (only the meta tags at lines 4-30) to stop this or any future leak.

Proposed fix

  1. In the Markdown preview, block remote images by default: use a DOMPurify hook to strip or replace src values that are not data: or blob:, and show a "Load remote images" toggle.
  2. Add a CSP <meta http-equiv="Content-Security-Policy"> to index.html, for example default-src 'self'; img-src 'self' data: blob:; connect-src * (API Tester needs connect-src), and confirm the inline theme script and the build still work (hash the inline script if needed).

Acceptance criteria

  • Pasting ![x](https://example.com/p.png) into the Markdown tool makes no network request until the user opts in.
  • The CSP is present on every generated page, the site works with it, and the DevTools console shows no CSP errors on Home, a tool page, and About.
Lingua principale
TypeScript
Stelle
2
Fork
1
Merge medio
1g 6h
PR unite (30g)
33

Preparare l'ambiente

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 ajithakdev/toolglass

Tutte le issue di ajithakdev/toolglass

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.