Navigation Failed Because The Request Was For An Http Url With Https-only Enabled [verified] -

The golden rule of 2026 is simple: APIs, images, iframes, and fonts.

If you are using Firefox (which popularized this feature) or any modern browser with strict security settings, you’ve likely hit this wall. In this post, we’ll break down why this happens, where the request is actually going, and three concrete ways to fix it without turning off security entirely. The error message is actually very literal. Your browser attempted to fetch a resource (an image, a script, an API endpoint, or a page navigation) using the standard http:// protocol. However, the browser’s internal HTTPS-Only Mode is active, and it is refusing to downgrade to unencrypted HTTP. The golden rule of 2026 is simple: APIs,

Strict-Transport-Security: max-age=31536000; includeSubDomains; preload Once the browser sees this header, it will automatically convert all future http:// requests to https:// before they are sent, eliminating the error. Sometimes you cannot control the external API—maybe a legacy vendor only serves HTTP. In this case, do not call the HTTP endpoint directly from the browser. Call your own HTTPS backend, and let your server proxy the request to the HTTP vendor. The error message is actually very literal

Audit your code for stray http:// references today—your users’ browsers are already doing the same. Call your own HTTPS backend

https://yourapp.com/api/proxy ➔ Your Server (Node.js/NGINX): http://legacy-vendor.com/data ➔ Back to Browser.

Add this header to your server (Apache/NGINX):