如何强制HTML通过HTTP而非HTTPS请求本地CSS/JS资源？

在本地localhost运行Express自定义HTML页面时一切正常，但部署到服务器后，页面会自动通过HTTPS请求所有本地CSS、JS文件，需要强制改为HTTP协议请求这些资源。此问题与Stack Overflow上未解决的「Using HTTP version but Chrome requests HTTPS for all css and js resources」情况类似。

可能的原因及对应解决方法 #

1. 检查服务器的HTTPS重定向配置 #

如果服务器（比如Nginx、Apache）开了全局HTTPS重定向，所有资源请求都会被强制转成HTTPS。

• 拿Nginx举例，找到配置文件里的重定向规则，比如：

  return 301 https://$host$request_uri;
  

  要是不需要全局HTTPS，直接注释或删掉这条规则；如果只需要部分页面走HTTPS，调整重定向的匹配条件就行。

2. 移除HSTS响应头 #

服务器或Express如果设置了HSTS（HTTP严格传输安全），浏览器会自动把后续所有请求转成HTTPS。

• 在Express里检查有没有这类中间件：

  app.use((req, res, next) => {
    res.setHeader('Strict-Transport-Security', 'max-age=31536000; includeSubDomains');
    next();
  });
  

  删除或注释这段代码，重启服务。
• 要是服务器（比如Nginx）配置了HSTS，找到对应配置项移除：

  add_header Strict-Transport-Security "max-age=31536000; includeSubDomains";
  

3. 修正HTML里的资源路径 #

• 别用协议相对路径（//xxx.css），这种路径会自动继承当前页面的协议。
• 直接给资源加HTTP前缀：

  <link rel="stylesheet" href="http://你的域名/css/style.css">
  <script src="http://你的域名/js/main.js"></script>
  

• 或者用相对路径（前提是服务器本身跑在HTTP上）：

  <link rel="stylesheet" href="/css/style.css">
  <script src="/js/main.js"></script>
  

4. 调整Express静态资源及代理配置 #

确保Express的静态资源中间件没强制HTTPS的设置：

// 正常的静态资源配置（无强制HTTPS）
app.use(express.static('public'));
// 或者指定路径
app.use('/static', express.static(path.join(__dirname, 'public')));

如果用了反向代理，给Express加上识别真实协议的配置，甚至强制设为HTTP：

// 信任代理服务器
app.set('trust proxy', true);
app.use((req, res, next) => {
  req.protocol = 'http'; // 强制把请求协议设为HTTP
  next();
});

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