本地加载JavaScript文件遇SSL及404错误的解决请求

1. 解决 ERR_SSL_PROTOCOL_ERROR 错误 #

本地Express服务器默认只启用HTTP协议，未配置SSL证书，因此使用https://访问会触发SSL协议错误。切换为http://是正确的修正方式，无需额外调整。

2. 解决 404 Not Found 错误 #

该错误核心是静态文件路径映射不匹配，具体问题与修复方案如下：

问题分析 #

• Express配置中api.use('/script', express.static('public'))，是将public目录下的文件映射到/script路由，但你的test.js实际位于./script/test.js，不在public目录内，导致服务器找不到文件。
• index.js中的const { test } = require('./script/test.js');完全多余，因为test.js未导出任何模块成员，这行代码会引发运行时错误，建议删除。

修复方案（二选一） #

方案A：调整文件目录结构

将test.js移动到public目录下，目录结构变为：

项目根目录/
├── public/
│   ├── nps.style.css
│   └── test.js
├── index.js
└── index.html

此时http://localhost:4200/script/test.js可正确访问public/test.js。

方案B：修改Express静态文件配置

将index.js中的静态文件路由配置改为：

api.use('/script', express.static('script'));

这会直接把./script目录映射到/script路由，无需移动文件即可让http://localhost:4200/script/test.js访问到./script/test.js。

验证修复 #

1. 重启Express服务器
2. 刷新浏览器页面，若弹出alert("it works!")，则说明脚本加载成功。

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