Some checks failed
Deploy to Phoenix / deploy (push) Has been cancelled
Co-authored-by: Cursor <cursoragent@cursor.com>
169 lines
4.2 KiB
Markdown
169 lines
4.2 KiB
Markdown
# NPMplus CSP and Quirks Mode Fix
|
|
|
|
**Last Updated:** 2026-01-31
|
|
**Document Version:** 1.0
|
|
**Status:** Active Documentation
|
|
|
|
---
|
|
|
|
**Date**: 2026-01-16
|
|
**Status**: ✅ CSP Fixed | ⚠️ Quirks Mode Requires Backend Fix
|
|
|
|
---
|
|
|
|
## Issues Resolved
|
|
|
|
### ✅ Content Security Policy (CSP)
|
|
|
|
**Problem**: CSP was blocking `eval()` in JavaScript, causing errors:
|
|
```
|
|
Content Security Policy of your site blocks the use of 'eval' in JavaScript
|
|
```
|
|
|
|
**Solution**: Updated NPMplus advanced configuration to include CSP header that allows `unsafe-eval`:
|
|
|
|
```nginx
|
|
add_header Content-Security-Policy "default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval' https: data:; style-src 'self' 'unsafe-inline' https: data:; font-src 'self' https: data:; img-src 'self' data: https: blob:; connect-src 'self' https: wss: ws:; media-src 'self' https: data:; object-src 'none'; base-uri 'self'; form-action 'self' https:; frame-ancestors 'none'; upgrade-insecure-requests" always;
|
|
```
|
|
|
|
**Status**: ✅ Fixed for all 19 domains
|
|
|
|
---
|
|
|
|
### ⚠️ Quirks Mode
|
|
|
|
**Problem**: Browser reports Quirks Mode:
|
|
```
|
|
Page layout may be unexpected due to Quirks Mode
|
|
One or more documents in this page is in Quirks Mode
|
|
```
|
|
|
|
**Root Cause**: Backend services are not sending proper `<!DOCTYPE html>` declaration in HTML responses.
|
|
|
|
**Solution**: Backend services must include proper DOCTYPE in HTML responses.
|
|
|
|
#### For Backend Services:
|
|
|
|
**Express.js / Node.js:**
|
|
```javascript
|
|
// Ensure HTML responses include DOCTYPE
|
|
app.get('*', (req, res) => {
|
|
res.send(`<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Your App</title>
|
|
</head>
|
|
<body>
|
|
<!-- content -->
|
|
</body>
|
|
</html>`);
|
|
});
|
|
```
|
|
|
|
**Nginx (if serving static files):**
|
|
```nginx
|
|
# Ensure HTML files have DOCTYPE
|
|
# This is typically handled by the application, not Nginx
|
|
```
|
|
|
|
**Python / Flask:**
|
|
```python
|
|
@app.route('/')
|
|
def index():
|
|
return '''<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Your App</title>
|
|
</head>
|
|
<body>
|
|
<!-- content -->
|
|
</body>
|
|
</html>'''
|
|
```
|
|
|
|
**Note**: NPMplus/Nginx cannot modify HTML body content to add DOCTYPE. This must be fixed in the backend application.
|
|
|
|
---
|
|
|
|
## CSP Configuration Details
|
|
|
|
### Current CSP Policy
|
|
|
|
The updated CSP allows:
|
|
- ✅ `'unsafe-eval'` - Allows `eval()` for legacy JavaScript
|
|
- ✅ `'unsafe-inline'` - Allows inline scripts/styles
|
|
- ✅ `https:` - Allows loading resources from any HTTPS source
|
|
- ✅ `data:` - Allows data URIs (for images, fonts)
|
|
- ✅ `wss: ws:` - Allows WebSocket connections
|
|
|
|
### Security Considerations
|
|
|
|
⚠️ **Warning**: Allowing `'unsafe-eval'` reduces security but is necessary for:
|
|
- Legacy JavaScript applications
|
|
- Frameworks that use `eval()` internally
|
|
- Development environments
|
|
|
|
**For Production**: Consider removing `'unsafe-eval'` if possible and refactoring code to avoid `eval()`.
|
|
|
|
---
|
|
|
|
## Verification
|
|
|
|
### Check CSP Header
|
|
|
|
```bash
|
|
curl -I -k https://sankofa.nexus | grep -i "content-security"
|
|
```
|
|
|
|
Expected output:
|
|
```
|
|
content-security-policy: default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval' https: data:; ...
|
|
```
|
|
|
|
### Check in Browser
|
|
|
|
1. Open browser DevTools (F12)
|
|
2. Go to **Network** tab
|
|
3. Reload page
|
|
4. Click on the main document request
|
|
5. Check **Response Headers** for `Content-Security-Policy`
|
|
|
|
---
|
|
|
|
## Scripts Created
|
|
|
|
1. **`scripts/fix-npmplus-csp-headers.sh`**
|
|
- Updates CSP headers for all proxy hosts
|
|
- Allows `unsafe-eval` for legacy JavaScript
|
|
- Can be re-run to update additional domains
|
|
|
|
**Usage:**
|
|
```bash
|
|
bash scripts/fix-npmplus-csp-headers.sh \
|
|
https://192.168.0.166:81 \
|
|
nsatoshi2007@hotmail.com \
|
|
ce8219e321e1cd97bd590fb792d3caeb7e2e3b94ca7e20124acaf253f911ff72
|
|
```
|
|
|
|
---
|
|
|
|
## Next Steps
|
|
|
|
### For CSP (✅ Complete)
|
|
- CSP headers are configured for all domains
|
|
- `eval()` should now work without errors
|
|
|
|
### For Quirks Mode (⚠️ Requires Backend Fix)
|
|
1. **Identify Backend Services**: Determine which services serve HTML without DOCTYPE
|
|
2. **Update Backend Code**: Add `<!DOCTYPE html>` to HTML responses
|
|
3. **Test**: Verify Quirks Mode warning disappears in browser DevTools
|
|
|
|
---
|
|
|
|
## Related Documentation
|
|
|
|
- [NPMplus Migration Guide](./NPMPLUS_MIGRATION_GUIDE.md)
|
|
- [Server Headers Configuration](../../smom-dbis-138/orchestration/portal/SERVER_HEADERS.md)
|