fix: service edit, CSRF token stability, and license restore (v1.1.1)

- Fix service edit double-write bug (was creating duplicate entries)
- Add editable display name field to service edit modal
- Backend update endpoint now accepts name, logo, and recalculates url
- Fix CSRF token regeneration breaking all POST requests (nonce was
  being regenerated on every request, invalidating cached tokens)
- CSRF nonce now persists across requests, rotated only on TOTP login
- Frontend secureFetch auto-retries on CSRF failure with fresh token
- Restore lifetime license activation on DNS2

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-23 13:39:05 -07:00
parent 263b090769
commit b4022288dc
9 changed files with 122 additions and 70 deletions

View File

@@ -1 +1 @@
1 2

View File

@@ -49,31 +49,56 @@ function parseCookie(cookieHeader) {
} }
/** /**
* Middleware to set CSRF cookie on all requests. * Middleware to set CSRF cookie on requests.
* Always generates a fresh nonce server-side (never trusts client-supplied values). * Preserves existing nonce to avoid invalidating tokens the client has cached.
* The cookie holds the nonce; JavaScript must read it and send the HMAC signature * New nonce is generated only on first visit (no cookie) or after TOTP login
* in the x-csrf-token header. The /api/csrf-token endpoint provides the signature. * (which calls renewCSRFToken). If TOTP is disabled, the nonce is set once
* and never changes.
*/ */
function csrfCookieMiddleware(req, res, next) { function csrfCookieMiddleware(req, res, next) {
// Always generate a fresh server-side nonce const cookies = parseCookie(req.headers.cookie);
const csrfNonce = generateToken(); const existingNonce = cookies[CSRF_COOKIE_NAME];
// Reuse existing nonce; only generate fresh if no cookie exists yet
const csrfNonce = existingNonce || generateToken();
// Store nonce + signature on request so endpoints can access them // Store nonce + signature on request so endpoints can access them
req.csrfToken = signToken(csrfNonce); req.csrfToken = signToken(csrfNonce);
req.csrfNonce = csrfNonce; req.csrfNonce = csrfNonce;
// Set cookie with the nonce (SameSite=Strict for additional protection) // Only set cookie if it's new (avoids unnecessary Set-Cookie headers)
if (!existingNonce) {
res.cookie(CSRF_COOKIE_NAME, csrfNonce, { res.cookie(CSRF_COOKIE_NAME, csrfNonce, {
httpOnly: false, // Must be readable by JavaScript for signing httpOnly: false, // Must be readable by JavaScript for signing
secure: req.secure || req.protocol === 'https', // Only secure in HTTPS secure: req.secure || req.protocol === 'https',
sameSite: 'strict', sameSite: 'strict',
path: '/', path: '/',
maxAge: 24 * 60 * 60 * 1000 // 24 hours maxAge: 365 * 24 * 60 * 60 * 1000 // 1 year (effectively permanent)
}); });
}
next(); next();
} }
/**
* Generate a fresh CSRF nonce and set it on the response.
* Called after TOTP login to rotate the token for the new session.
* @param {Object} res - Express response object
* @param {boolean} secure - Whether to set Secure flag on cookie
* @returns {string} The new CSRF signed token
*/
function renewCSRFToken(res, secure) {
const csrfNonce = generateToken();
res.cookie(CSRF_COOKIE_NAME, csrfNonce, {
httpOnly: false,
secure: !!secure,
sameSite: 'strict',
path: '/',
maxAge: 365 * 24 * 60 * 60 * 1000
});
return signToken(csrfNonce);
}
/** /**
* Middleware to validate CSRF token on state-changing requests * Middleware to validate CSRF token on state-changing requests
* Validates that the token in the cookie matches the token in the header * Validates that the token in the cookie matches the token in the header
@@ -174,5 +199,6 @@ module.exports = {
signToken, signToken,
parseCookie, parseCookie,
csrfCookieMiddleware, csrfCookieMiddleware,
csrfValidationMiddleware csrfValidationMiddleware,
renewCSRFToken
}; };

View File

@@ -1,6 +1,6 @@
{ {
"name": "dashcaddy-api", "name": "dashcaddy-api",
"version": "1.1.0", "version": "1.1.1",
"description": "DashCaddy API server - Dashboard backend for Docker, Caddy & DNS management", "description": "DashCaddy API server - Dashboard backend for Docker, Caddy & DNS management",
"main": "server.js", "main": "server.js",
"scripts": { "scripts": {

View File

@@ -1,4 +1,5 @@
const express = require('express'); const express = require('express');
const { renewCSRFToken } = require('../../csrf-protection');
module.exports = function(ctx) { module.exports = function(ctx) {
const router = express.Router(); const router = express.Router();
@@ -104,8 +105,12 @@ module.exports = function(ctx) {
ctx.log.info('auth', 'TOTP verified, creating session', { ip: ctx.session.getClientIP(req), duration: ctx.totpConfig.sessionDuration }); ctx.log.info('auth', 'TOTP verified, creating session', { ip: ctx.session.getClientIP(req), duration: ctx.totpConfig.sessionDuration });
ctx.session.create(req, ctx.totpConfig.sessionDuration); ctx.session.create(req, ctx.totpConfig.sessionDuration);
ctx.session.setCookie(res, ctx.totpConfig.sessionDuration); ctx.session.setCookie(res, ctx.totpConfig.sessionDuration);
// Rotate CSRF token for the new session
const newCsrfToken = renewCSRFToken(res, req.secure || req.protocol === 'https');
ctx.log.debug('auth', 'Session created', { sessions: ctx.session.ipSessions.size }); ctx.log.debug('auth', 'Session created', { sessions: ctx.session.ipSessions.size });
res.json({ success: true, message: 'Authenticated successfully', sessionDuration: ctx.totpConfig.sessionDuration }); res.json({ success: true, message: 'Authenticated successfully', sessionDuration: ctx.totpConfig.sessionDuration, csrfToken: newCsrfToken });
}, 'totp-verify')); }, 'totp-verify'));
// Check session validity (used by Caddy forward_auth) // Check session validity (used by Caddy forward_auth)

View File

@@ -371,9 +371,9 @@ module.exports = function(ctx) {
res.json({ success: true, message: `Service "${id}" removed from dashboard` }); res.json({ success: true, message: `Service "${id}" removed from dashboard` });
}, 'services-delete')); }, 'services-delete'));
// Update service configuration (subdomain, port, IP, tailscale) // Update service configuration (subdomain, port, IP, tailscale, name, logo)
router.post('/services/update', ctx.asyncHandler(async (req, res) => { router.post('/services/update', ctx.asyncHandler(async (req, res) => {
const { oldSubdomain, newSubdomain, port, ip, tailscaleOnly } = req.body; const { oldSubdomain, newSubdomain, port, ip, tailscaleOnly, name, logo } = req.body;
if (!oldSubdomain || !newSubdomain) { if (!oldSubdomain || !newSubdomain) {
return ctx.errorResponse(res, 400, 'oldSubdomain and newSubdomain are required'); return ctx.errorResponse(res, 400, 'oldSubdomain and newSubdomain are required');
@@ -440,13 +440,20 @@ module.exports = function(ctx) {
await ctx.servicesStateManager.update(services => { await ctx.servicesStateManager.update(services => {
const serviceIndex = services.findIndex(s => s.id === oldSubdomain); const serviceIndex = services.findIndex(s => s.id === oldSubdomain);
if (serviceIndex !== -1) { if (serviceIndex !== -1) {
const existing = services[serviceIndex];
const finalPort = port || existing.port;
const finalIp = ip || existing.ip;
services[serviceIndex] = { services[serviceIndex] = {
...services[serviceIndex], ...existing,
id: newSubdomain, id: newSubdomain,
port: port || services[serviceIndex].port, port: finalPort,
ip: ip || services[serviceIndex].ip, ip: finalIp,
tailscaleOnly: tailscaleOnly || false tailscaleOnly: tailscaleOnly || false,
url: ctx.buildServiceUrl(newSubdomain)
}; };
if (name) services[serviceIndex].name = name;
if (logo) services[serviceIndex].logo = logo;
results.services = 'updated'; results.services = 'updated';
} else { } else {
results.services = 'not found'; results.services = 'not found';

View File

@@ -10,7 +10,7 @@
const modal = document.getElementById('service-edit-modal'); const modal = document.getElementById('service-edit-modal');
document.getElementById('service-edit-title').textContent = `Edit ${service.name}`; document.getElementById('service-edit-title').textContent = `Edit ${service.name}`;
document.getElementById('edit-service-name-display').textContent = service.name; document.getElementById('edit-service-name').value = service.name;
document.getElementById('edit-service-url-display').textContent = service.url || buildServiceUrl(service.id); document.getElementById('edit-service-url-display').textContent = service.url || buildServiceUrl(service.id);
document.getElementById('edit-service-logo-preview').src = service.logo || `/assets/${service.id}.png`; document.getElementById('edit-service-logo-preview').src = service.logo || `/assets/${service.id}.png`;
document.getElementById('edit-subdomain').value = service.id; document.getElementById('edit-subdomain').value = service.id;
@@ -31,6 +31,7 @@
if (!currentEditService) return; if (!currentEditService) return;
const newSubdomain = document.getElementById('edit-subdomain').value.trim().toLowerCase(); const newSubdomain = document.getElementById('edit-subdomain').value.trim().toLowerCase();
const newName = document.getElementById('edit-service-name').value.trim();
const newPort = document.getElementById('edit-port').value.trim(); const newPort = document.getElementById('edit-port').value.trim();
const newIp = document.getElementById('edit-ip').value.trim() || 'localhost'; const newIp = document.getElementById('edit-ip').value.trim() || 'localhost';
const tailscaleOnly = document.getElementById('edit-tailscale-only').checked; const tailscaleOnly = document.getElementById('edit-tailscale-only').checked;
@@ -45,10 +46,11 @@
const changes = []; const changes = [];
if (newSubdomain !== oldSubdomain) changes.push('subdomain'); if (newSubdomain !== oldSubdomain) changes.push('subdomain');
if (newName && newName !== currentEditService.name) changes.push('name');
if (newPort && newPort !== String(currentEditService.port)) changes.push('port'); if (newPort && newPort !== String(currentEditService.port)) changes.push('port');
if (newIp !== currentEditService.ip) changes.push('ip'); if (newIp !== currentEditService.ip) changes.push('ip');
if (tailscaleOnly !== (currentEditService.tailscaleOnly || false)) changes.push('tailscale'); if (tailscaleOnly !== (currentEditService.tailscaleOnly || false)) changes.push('tailscale');
if (newLogo !== currentEditService.logo) changes.push('logo'); if (newLogo && newLogo !== currentEditService.logo) changes.push('logo');
if (changes.length === 0) { if (changes.length === 0) {
closeServiceEditModal(); closeServiceEditModal();
@@ -60,16 +62,17 @@
saveBtn.disabled = true; saveBtn.disabled = true;
try { try {
if (changes.includes('subdomain') || changes.includes('port') || changes.includes('ip') || changes.includes('tailscale')) {
const response = await secureFetch('/api/v1/services/update', { const response = await secureFetch('/api/v1/services/update', {
method: 'POST', method: 'POST',
headers: { 'Content-Type': 'application/json' }, headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ body: JSON.stringify({
oldSubdomain, oldSubdomain,
newSubdomain, newSubdomain,
name: newName || currentEditService.name,
port: newPort || currentEditService.port, port: newPort || currentEditService.port,
ip: newIp, ip: newIp,
tailscaleOnly tailscaleOnly,
logo: newLogo || undefined
}) })
}); });
@@ -77,14 +80,14 @@
if (!result.success) { if (!result.success) {
throw new Error(result.error || 'Failed to update service'); throw new Error(result.error || 'Failed to update service');
} }
}
// Update local APPS array // Update local APPS array to match
const appIndex = window.APPS.findIndex(a => a.id === oldSubdomain); const appIndex = window.APPS.findIndex(a => a.id === oldSubdomain);
if (appIndex !== -1) { if (appIndex !== -1) {
window.APPS[appIndex] = { window.APPS[appIndex] = {
...window.APPS[appIndex], ...window.APPS[appIndex],
id: newSubdomain, id: newSubdomain,
name: newName || window.APPS[appIndex].name,
port: newPort || window.APPS[appIndex].port, port: newPort || window.APPS[appIndex].port,
ip: newIp, ip: newIp,
tailscaleOnly, tailscaleOnly,
@@ -92,27 +95,6 @@
}; };
} }
// Update services via API
await secureFetch('/api/v1/services', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
id: newSubdomain,
name: currentEditService.name,
port: newPort || currentEditService.port,
ip: newIp,
logo: newLogo || currentEditService.logo,
tailscaleOnly,
containerId: currentEditService.containerId,
appTemplate: currentEditService.appTemplate
})
});
// If subdomain changed, remove old entry
if (newSubdomain !== oldSubdomain) {
await secureFetch(`/api/v1/services/${oldSubdomain}`, { method: 'DELETE' });
}
closeServiceEditModal(); closeServiceEditModal();
window.buildGrid(); window.buildGrid();
window.refreshAll(); window.refreshAll();

View File

@@ -12,12 +12,19 @@
<!-- Service Info --> <!-- Service Info -->
<div style="display: flex; align-items: center; gap: 12px; padding: 12px; background: var(--card-bg); border-radius: 8px;"> <div style="display: flex; align-items: center; gap: 12px; padding: 12px; background: var(--card-bg); border-radius: 8px;">
<img id="edit-service-logo-preview" src="" alt="" style="width: 48px; height: 48px; border-radius: 8px; object-fit: contain; background: var(--bg);" /> <img id="edit-service-logo-preview" src="" alt="" style="width: 48px; height: 48px; border-radius: 8px; object-fit: contain; background: var(--bg);" />
<div> <div style="flex: 1;">
<div id="edit-service-name-display" style="font-weight: 600; font-size: 1.1rem;"></div>
<div id="edit-service-url-display" class="text-muted-sm"></div> <div id="edit-service-url-display" class="text-muted-sm"></div>
</div> </div>
</div> </div>
<!-- Display Name -->
<div>
<label for="edit-service-name" class="form-label-accent-sm">
Display Name
</label>
<input type="text" id="edit-service-name" class="form-input-md" placeholder="Service name shown on dashboard" />
</div>
<!-- Subdomain --> <!-- Subdomain -->
<div> <div>
<label for="edit-subdomain" class="form-label-accent-sm"> <label for="edit-subdomain" class="form-label-accent-sm">

View File

@@ -166,16 +166,18 @@ async function getCSRFToken() {
} }
/** /**
* Secure fetch wrapper that automatically adds CSRF token to state-changing requests * Secure fetch wrapper that automatically adds CSRF token to state-changing requests.
* If the server returns a CSRF error (403 with DC-100/DC-101), automatically
* refreshes the token and retries once.
* @param {string} url - URL to fetch * @param {string} url - URL to fetch
* @param {Object} options - Fetch options * @param {Object} options - Fetch options
* @returns {Promise<Response>} Fetch response * @returns {Promise<Response>} Fetch response
*/ */
async function secureFetch(url, options = {}) { async function secureFetch(url, options = {}) {
const method = (options.method || 'GET').toUpperCase(); const method = (options.method || 'GET').toUpperCase();
const needsCsrf = !['GET', 'HEAD', 'OPTIONS'].includes(method);
// Add CSRF token for state-changing methods if (needsCsrf) {
if (!['GET', 'HEAD', 'OPTIONS'].includes(method)) {
try { try {
const token = await getCSRFToken(); const token = await getCSRFToken();
options.headers = { options.headers = {
@@ -192,8 +194,27 @@ async function secureFetch(url, options = {}) {
options = { ...options, signal: AbortSignal.timeout(15000) }; options = { ...options, signal: AbortSignal.timeout(15000) };
} }
const response = await fetch(url, options);
// Auto-retry once on CSRF failure (token may have been rotated by TOTP re-auth)
if (needsCsrf && response.status === 403) {
try {
const body = await response.clone().json();
if (body.error && (body.error.includes('DC-100') || body.error.includes('DC-101'))) {
csrfToken = null; // Clear cached token
const freshToken = await getCSRFToken();
options.headers = { ...options.headers, 'X-CSRF-Token': freshToken };
// New signal for retry (old one may have been consumed)
options.signal = AbortSignal.timeout(15000);
return fetch(url, options); return fetch(url, options);
} }
} catch (_) {
// If clone/json fails, return original response
}
}
return response;
}
// ===== API CALL HELPERS ===== // ===== API CALL HELPERS =====

View File

@@ -75,6 +75,10 @@
if (data.success) { if (data.success) {
errorEl.textContent = ''; errorEl.textContent = '';
// Update cached CSRF token from TOTP response (server rotates it on login)
if (data.csrfToken) {
csrfToken = data.csrfToken;
}
hideTotpOverlay(); hideTotpOverlay();
// Check if redirected here from another service // Check if redirected here from another service
const redirect = safeSessionGet('totp_redirect'); const redirect = safeSessionGet('totp_redirect');