Cross Site Request Forgery in Chi with Basic Auth

Cross Site Request Forgery (CSRF) in Chi with HTTP Basic Authentication creates a scenario where an authenticated session can be abused across origins without proper anti-CSRF controls. Basic Auth sends credentials in the Authorization header on every request; when a browser automatically includes cookies alongside that header, state-changing endpoints become vulnerable if they rely only on the presence of credentials and lack origin/action verification.

Chi routes typically use session cookies for additional context (e.g., CSRF tokens stored in cookies) while the Authorization header carries the Basic Auth credentials. If an endpoint accepts both the Basic Auth header and session cookies from an untrusted origin, a malicious site can craft a form or script that triggers a state-changing request. Because browsers attach cookies automatically, the server sees a valid Basic Auth context and processes the request as intended by the attacker.

Consider a Chi application that protects a change-email endpoint with Basic Auth but does not validate the Origin header or require a per-request token. An attacker can host a page with an image or form pointing to https://api.example.com/v1/users/me/email with a forged JSON body. When a logged-in user visits the attacker’s page, the browser sends the Authorization header and any session cookies, leading to an unauthorized email change. This pattern mirrors classic OWASP API Top 10 API1:2023 – Broken Object Level Authorization when combined with missing CSRF mitigations, and can be discovered by scans such as those provided by middleBrick.

SSR client-side code exacerbates the risk: JavaScript running in the browser can read responses if CORS is permissive, but even without CORS, unsafe methods like GET or unsafe POSTs without CSRF tokens enable unauthorized actions. MiddleBrick’s checks for CORS misconfigurations and unsafe consumption complement API spec analysis, helping teams correlate runtime behavior with OpenAPI/Swagger definitions that may omit CSRF protections.

In Chi, developers often assume Basic Auth is sufficient because credentials are base64-encoded, but this encoding is not encryption. Without additional measures—such as SameSite cookies, anti-CSRF tokens, or strict Origin validation—the combination of Basic Auth and session state remains vulnerable. Tools that support OpenAPI spec analysis with full $ref resolution, like middleBrick, can highlight endpoints missing CSRF-related security checks and align them with OWASP API Top 10 and SOC2 controls.

Pro-tier continuous monitoring can help detect changes in authentication patterns that may indicate attempted CSRF exploitation, while the free tier provides a starting point to scan unauthenticated attack surfaces. Remember, middleBrick detects and reports findings with remediation guidance; it does not automatically fix or block requests.

To remediate CSRF when using Basic Auth in Chi, implement anti-CSRF tokens and enforce strict Origin and Referer checks. Combine server-side token validation with secure cookie attributes to ensure requests originate from your own frontend.

Example: a Chi route that requires both a valid Basic Auth header and a per-request CSRF token stored in a SameSite cookie.

// Chi routes with Basic Auth and CSRF protection
import chi from 'chi';
import { createHash } from 'crypto';

const app = chi();

// Middleware to extract Basic Auth credentials
const basicAuth = (req, res, next) => {
  const authHeader = req.headers['authorization'] || '';
  const [scheme, credentials] = authHeader.split(' ');
  if (scheme !== 'Basic') return res.status(401).send('Unauthorized');
  const [user, pass] = Buffer.from(credentials, 'base64').toString().split(':');
  if (user !== 'admin' || pass !== 'secret') return res.status(403).send('Forbidden');
  req.user = { user };
  next();
};

// Middleware to validate CSRF token
const validateCsrf = (req, res, next) => {
  const token = req.headers['x-csrf-token'];
  const cookieToken = req.cookies.csrfToken;
  if (!token || !cookieToken || token !== cookieToken) {
    return res.status(403).send('Invalid CSRF token');
  }
  next();
};

app.post('/v1/users/me/email', [basicAuth, validateCsrf], (req, res) => {
  const { email } = req.body;
  // Validate and update email logic here
  res.json({ ok: true, email });
});

app.get('/login', (req, res) => {
  // Set CSRF token in a SameSite cookie
  const csrfToken = createHash('sha256').update(Date.now().toString()).digest('hex');
  res.cookie('csrfToken', csrfToken, { httpOnly: true, sameSite: 'strict', secure: true });
  res.send('Login page with CSRF token');
});

Frontend example: include the CSRF token in headers for state-changing requests.

// JavaScript fetch example
fetch('https://api.example.com/v1/users/me/email', {
  method: 'POST',
  credentials: 'include', // sends cookies
  headers: {
    'Content-Type': 'application/json',
    'Authorization': 'Basic ' + btoa('admin:secret'),
    'X-CSRF-Token': document.querySelector('meta[name="csrf-token"]').content
  },
  body: JSON.stringify({ email: '[email protected]' })
});

Additional measures:

• Set SameSite=Strict or Lax on session and CSRF cookies to prevent cross-origin sends.
• Validate the Origin header on sensitive endpoints to reject cross-site requests.
• Use HTTPS to protect Basic Auth credentials in transit.
• Leverage middleBrick Pro plan to enable continuous monitoring and receive alerts on anomalous authentication patterns that may indicate CSRF-related probing.

By combining per-request tokens with strict cookie policies and header validation, you mitigate CSRF while retaining Basic Auth for credential-based authentication in Chi.