Next.js 14.2 App Router下如何强制跳转至HTTP协议OAuth地址？

你遇到的问题是浏览器的HTTPS自动升级机制导致的——当你的应用运行在HTTPS环境下，浏览器会默认将HTTP链接强制升级为HTTPS（比如通过HSTS策略），不管你用Next.js的router.push还是原生<a>标签都会被拦截。

针对公司内网场景，你可以用以下几种方法解决：

1. 清除浏览器HSTS缓存（最快临时方案） #

因为是内网环境，你可以手动清除目标域名的HSTS记录：

• Chrome：地址栏输入 chrome://net-internals/#hsts，在「Delete domain security policies」输入框中填入blahid，点击「Delete」。
• Firefox：地址栏输入 about:config，搜索network.stricttransportsecurity.preloadlist并设为false；或者进入「隐私与安全」-「清除数据」，勾选「站点设置」后清除对应域名的缓存。

2. 改用原生JS跳转绕过框架路由拦截 #

Next.js的router.push会走框架路由逻辑，容易被浏览器安全策略影响，直接用原生window.location跳转可以绕过这个问题：
修改按钮点击事件代码：

const handleClick = (e) => {
  e.preventDefault();
  const targetUrl = "http://blahid/oauth/authorize?response_type=code&blahblahblah/callback";
  window.location.href = targetUrl;
};

如果需要在新窗口打开，可用：

window.open(targetUrl, "_self"); // _self表示当前窗口，_blank为新窗口

3. 服务器端临时禁用HSTS（若有权限） #

如果你的Next.js应用是自主部署的，可以在服务器响应头中添加Strict-Transport-Security: max-age=0，强制浏览器忽略该域名的HSTS策略。注意这个方法仅适合开发/内网环境，不要在公网生产环境使用。

内容的提问来源于stack exchange，提问作者rubyongainz