{userInput}
; // Безопасно! React экранирует\n```\n\n### Защита 2: Content Security Policy (CSP)\n\nЭто HTTP заголовок который говорит браузеру какой контент можно загружать:\n\n```\nContent-Security-Policy: \n default-src 'self'; \n script-src 'self' https://cdn.jsdelivr.net;\n style-src 'self' 'unsafe-inline';\n img-src *;\n```\n\nЭто предотвращает:\n- Загрузку скриптов с неизвестных источников\n- Inline скрипты типа `` (если нет `unsafe-inline`)\n- Eval и dynamic code generation\n\n```javascript\n// Будет заблокировано если CSP запрещает eval\neval('alert(1)'); // Blocked!\nsetTimeout('alert(1)', 100); // Blocked!\n```\n\n### Защита 3: Input Validation (Валидация входа)\n\nПроверяй что пользователь вводит именно то что ожидаешь:\n\n```javascript\n// ✅ Для email\nfunction validateEmail(email) {\n return /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/.test(email);\n}\n\n// ✅ Для URL\nfunction validateURL(url) {\n try {\n new URL(url);\n return true;\n } catch {\n return false;\n }\n}\n\n// ✅ Для чисел\nfunction validateNumber(num) {\n return /^\\d+$/.test(num);\n}\n\n// Использование\nif (!validateEmail(userEmail)) {\n throw new Error('Invalid email');\n}\n```\n\n### Защита 4: Sanitization библиотеки\n\nДля случаев когда нужно разрешить НЕКОТОРЫЙ HTML (например markdown в комментариях):\n\n```javascript\n// Используй DOMPurify\nimport DOMPurify from 'dompurify';\n\nconst userComment = 'Hello
';\nconst clean = DOMPurify.sanitize(userComment);\n// Результат:Hello
\n// Скрипт удалён!\n\ndocument.getElementById('comments').innerHTML = clean;\n```\n\nДругие библиотеки:\n- **xss** — для Node.js\n- **bleach** — для Python (на бэкенде)\n- **Markdown-it с плагинами** — для безопасного markdown\n\n### Защита 5: HttpOnly Cookie флаг\n\nНа сервере выставь флаг HttpOnly для cookies:\n\n```python\nresponse.set_cookie('session_id', token, httponly=True)\n```\n\nБраузер не позволит JavaScript получить доступ:\n\n```javascript\n// ❌ Не сработает если httponly=true\nconst sessionId = document.cookie; // session_id не будет видна\n\n// Даже если XSS есть, атакующий не может украсть session\n```\n\n### Защита 6: CORS и SameSite\n\n**CORS** — контролирует кроме-доменные запросы:\n\n```\nAccess-Control-Allow-Origin: https://trusted-domain.com\n```\n\n**SameSite cookie флаг** — предотвращает CSRF:\n\n```python\nresponse.set_cookie('session', token, samesite='Strict')\n```\n\nБраузер не отправит cookie при cross-site запросах.\n\n### Практический пример: Безопасная форма комментариев\n\n```javascript\n// React компонент\nfunction CommentForm() {\n const [comment, setComment] = useState('');\n\n const handleSubmit = (e) => {\n e.preventDefault();\n \n // Валидация\n if (comment.length > 5000) {\n alert('Comment too long');\n return;\n }\n \n // Отправить на сервер (сервер сделает sanitization)\n fetch('/api/comments', {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify({ content: comment })\n });\n };\n\n return (\n