63 lines
3.2 KiB
Markdown
63 lines
3.2 KiB
Markdown
# AdminLTE CSP Fix - Исправление Content Security Policy
|
||
|
||
## Проблема
|
||
Content Security Policy (CSP) блокировал загрузку jQuery и Bootstrap из CDN, что приводило к ошибкам:
|
||
|
||
```
|
||
Content-Security-Policy: The page's settings blocked a script (script-src-elem) at https://code.jquery.com/jquery-3.6.0.min.js
|
||
Content-Security-Policy: The page's settings blocked a script (script-src-elem) at https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js
|
||
```
|
||
|
||
## Причина
|
||
В server.js в настройках helmet CSP для `scriptSrc` отсутствовали домены:
|
||
- `https://code.jquery.com` (для jQuery)
|
||
- `https://cdn.jsdelivr.net` (для Bootstrap)
|
||
|
||
## Решение
|
||
Обновлены CSP настройки в `/server.js`:
|
||
|
||
### ДО:
|
||
```javascript
|
||
scriptSrc: ["'self'", "'unsafe-inline'", "https://cdnjs.cloudflare.com", "https://unpkg.com", "https://cdn.tailwindcss.com"],
|
||
```
|
||
|
||
### ПОСЛЕ:
|
||
```javascript
|
||
scriptSrc: ["'self'", "'unsafe-inline'", "https://cdnjs.cloudflare.com", "https://unpkg.com", "https://cdn.tailwindcss.com", "https://code.jquery.com", "https://cdn.jsdelivr.net"],
|
||
```
|
||
|
||
## Полная CSP конфигурация
|
||
```javascript
|
||
app.use(helmet({
|
||
contentSecurityPolicy: {
|
||
directives: {
|
||
defaultSrc: ["'self'"],
|
||
styleSrc: ["'self'", "'unsafe-inline'", "https://fonts.googleapis.com", "https://cdnjs.cloudflare.com", "https://cdn.jsdelivr.net", "https://unpkg.com", "https://cdn.tailwindcss.com"],
|
||
fontSrc: ["'self'", "https://fonts.gstatic.com", "https://cdnjs.cloudflare.com"],
|
||
scriptSrc: ["'self'", "'unsafe-inline'", "https://cdnjs.cloudflare.com", "https://unpkg.com", "https://cdn.tailwindcss.com", "https://code.jquery.com", "https://cdn.jsdelivr.net"],
|
||
imgSrc: ["'self'", "data:", "https:"],
|
||
connectSrc: ["'self'", "ws:", "wss:", "https://cdnjs.cloudflare.com", "https://cdn.jsdelivr.net", "https://unpkg.com", "https://fonts.googleapis.com", "https://fonts.gstatic.com", "https://cdn.tailwindcss.com"]
|
||
}
|
||
}
|
||
}));
|
||
```
|
||
|
||
## Результат
|
||
✅ AdminLTE 3 теперь работает полностью:
|
||
- ✅ CSS стили загружаются
|
||
- ✅ jQuery загружается без ошибок CSP
|
||
- ✅ Bootstrap загружается без ошибок CSP
|
||
- ✅ AdminLTE JavaScript функции работают
|
||
- ✅ Интерактивные элементы функциональны
|
||
|
||
## Тестирование
|
||
После исправления CSP:
|
||
1. Перезапустить сервер: `npm start`
|
||
2. Открыть админку: `http://localhost:3000/admin`
|
||
3. Проверить консоль браузера - ошибки CSP исчезли
|
||
4. Проверить функциональность: навигация, выпадающие меню, модальные окна
|
||
|
||
## Примечания
|
||
- Исправление обеспечивает безопасность через CSP при разрешении необходимых CDN
|
||
- AdminLTE теперь полностью функциональна с корейской локализацией
|
||
- Все зависимости загружаются правильно |