htmx.config.mode
Sets request mode for fetch()
The htmx.config.mode option sets the default mode for Fetch requests.
Per-element hx-config cannot override it. htmx resets that value to the global mode so injected markup cannot widen request scope from same-origin to cors.
Default: "same-origin"
Valid Values
-
"same-origin"- Only allow same-origin requests (default, most secure) -
"cors"- Allow cross-origin requests -
"no-cors"- Limited cross-origin requests -
"navigate"- Navigation mode
Example
htmx.config.mode = "cors";
<meta name="htmx-config" content='{"mode":"cors"}'> Security
The default "same-origin" means the browser will reject any cross-origin fetch outright, even if an attacker injects an hx-get pointing to an external URL.
If your app legitimately needs CORS (e.g. an API on a different subdomain), set mode globally and pair it with a Content-Security-Policy connect-src directive to limit reachable origins:
<meta http-equiv="Content-Security-Policy"
content="connect-src 'self' https://api.example.com"> This way, even if an attacker injects a target URL, CSP blocks connections to origins you haven’t explicitly allowed.
Licensed under the Zero-Clause BSD License.
https://four.htmx.org/reference/config/htmx-config-mode/