Hypermedia foundations

The server remains the security boundary

Apply authentication, authorization, validation, CSRF protection, and output escaping to every HTMX endpoint.

8 minute lesson

~~~

HTMX changes how the browser initiates a request. It does not change the server’s security responsibilities.

An attacker can copy this request without clicking your button:

<button hx-delete="/tasks/42">Delete</button>

The delete route must independently:

  1. authenticate the current user
  2. authorize that user for task 42
  3. verify CSRF protection for the state-changing request
  4. validate every submitted value
  5. perform the operation safely
  6. escape untrusted values in the returned HTML

Hiding a button is a user-interface decision, not authorization. HX-Request: true, hidden inputs, hx-vals, and IDs in the DOM are all controlled by the client.

Return an accurate status code and safe error fragment. A 403 may say the action is unavailable, but it must not reveal another user’s private task or an internal stack trace.

As an exercise, send the same request from curl without your page. If the server trusts an HTMX attribute or header that the browser normally supplied, the route has a security bug.

Lesson completed