Angular 5部署Windows Plesk服务器(GoDaddy)无法找到JSON文件

嘿，我来帮你排查这个Angular 5部署后JSON文件404的问题！本地正常但服务器报错，大概率是这几个地方出了问题，咱们一步步来解决：

1. 检查Angular构建配置里的assets路径 #

Angular 5使用的是.angular-cli.json配置文件，你得确保里面的assets数组包含了JSON文件所在的目录。比如你的JSON放在assets/json/下，配置应该像这样：

"assets": [
  "assets",
  "favicon.ico"
]
// 或者更明确指定json目录，避免遗漏
"assets": [
  "assets/json",
  "assets",
  "favicon.ico"
]

如果之前没配置这条，生产构建时Angular可能不会把JSON文件打包到dist目录里，服务器自然找不到。改完配置后重新执行ng build --prod再部署试试。

2. 确认base href设置是否正确 #

如果你的网站不是部署在服务器根目录（比如是http://megakyle83.com/my-app/），构建时必须指定base href：

ng build --prod --base-href "/my-app/"

要是网站在根目录，也要检查index.html里的<base href="/">是否正确，路径错位会直接导致JSON请求地址错误。

3. 注意服务器的文件路径大小写 #

本地Windows系统不区分文件名大小写，但服务器如果是Linux系统，是严格区分的。比如你本地写的是contactMe.json，但服务器上实际是contactme.json，就会直接报404。去服务器的dist目录里核对一下JSON文件的实际文件名和路径，必须和代码里请求的完全一致。

4. 服务器静态文件配置问题 #

像Nginx、Apache这类服务器，需要配置正确的静态文件访问规则，确保能指向dist目录里的assets文件。比如Nginx的配置可以这样写：

server {
    listen 80;
    server_name megakyle83.com;
    root /path/to/your/dist;
    index index.html;

    location / {
        try_files $uri $uri/ /index.html;
    }
}

这样服务器才能正确识别assets下的静态文件，不会因为路由规则把请求导去index.html而返回404。

5. 检查代码里的请求路径 #

确保你代码里请求JSON用的是相对路径，而不是硬写的绝对路径。比如用./assets/json/contactMe.json或者assets/json/contactMe.json，而不是直接写http://megakyle83.com/assets/json/contactMe.json。硬写绝对路径会导致部署环境变化时请求失效，配合base href的相对路径才是正确做法。

举个服务里请求的例子：

this.http.get('./assets/json/contactMe.json').subscribe(response => {
  // 处理返回数据
});

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