Angular调用localhost:8000/api报ERR_CONNECTION_REFUSED错误求助

net::ERR_CONNECTION_REFUSED错误核心是前端无法和localhost:8000上的后端服务建立连接，按以下步骤排查即可：

1. 后端服务运行验证 #

• 确认你的Node+Express后端服务已经成功启动，且监听端口确实为8000。后端启动后，可直接在浏览器访问http://localhost:8000/api，或通过Postman、curl工具调用该地址，验证是否能正常返回结果。
• 如果你是在WSL、Docker、虚拟机等非本地原生环境运行后端，需要将CrudService中的REST_API地址替换为对应环境的可访问IP，不能用localhost。

2. 跨域配置检查 #

Express后端必须配置CORS策略允许Angular前端的跨域请求，操作步骤：

1. 安装cors依赖：npm install cors
2. 在Express入口文件中加入配置：

const cors = require('cors');
// 放在路由注册之前
app.use(cors({
  origin: 'http://localhost:4200', // 替换为你Angular开发服务的实际运行地址
  methods: ['GET', 'POST', 'PUT', 'DELETE']
}));

3. 端口占用排查 #

如果8000端口被其他进程占用也会触发该错误，可通过以下命令检查：

• Windows：netstat -ano | findstr "8000"
• Mac/Linux：lsof -i :8000
  如果存在占用进程，可终止该进程，或统一修改前后端的服务端口为未被占用的端口。

4. 前端代码隐患修正 #

你提供的CrudService代码中，router变量未完成注入就调用会额外触发运行错误，修正方案：

// 先导入Router
import { Router } from '@angular/router';

@Injectable({
  providedIn: 'root'
})
export class CrudService {
  REST_API: string = 'http://localhost:8000/api';
  httpHeaders = new HttpHeaders().set('Content-Type', 'application/json');
  // 删除原本的router: any;声明，改为构造函数注入
  constructor(
    private httpClient: HttpClient,
    private router: Router
  ) { }
  // 其余代码保持不变
}

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