0 Tage Serie
javascript / beginner
Snippet

Vermeidung von Cross-Site Scripting durch Verzicht auf unsichere HTML-Injektion

Cross-Site Scripting (XSS) wird in Next.js-Komponenten vermieden, indem Variablen direkt in JSX gerendert werden, sodass React potenziell schädliche Skripte automatisch maskiert.

snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
// app/profile/page.js
export default function UserProfile({ searchParams }) {
// Safe: React automatically escapes strings inside JSX tags
const username = searchParams.name || 'Guest';
return (
<div>
<h1>Welcome, {username}!</h1>
</div>
);
}
nextjs
Erklärung
1
export default function UserProfile({ searchParams }) {
Deklariert eine Next.js-Seitenkomponente, die URL-Suchparameter entgegennimmt.
2
const username = searchParams.name || 'Guest';
Liest den nicht vertrauenswürdigen Benutzereingabe-String aus oder nutzt einen Standardwert.
3
<h1>Welcome, {username}!</h1>
Rendert die Benutzereingabe sicher innerhalb von JSX-Textknoten mit automatischer Maskierung.