Angular 前端代理

Angular 前端代理是指将前端应用中的 HTTP 请求代理到其他服务器或者接口服务上，以解决跨域问题或访问受限问题。

通常使用 Angular 自带的 HttpClient 库发送 HTTP 请求，但在某些情况下，后端服务器可能不允许跨域访问或者需要认证，这时候就需要使用前端代理，通过特定的配置将请求转发到代理服务器。

在 Angular 中，可以通过修改 package.json 文件中的 start 脚本，来配置前端代理。例如，在 start 脚本中添加以下参数：

"start": "ng serve --proxy-config proxy.conf.json"

然后在项目根目录下创建一个名为 proxy.conf.json 的文件，来配置代理规则，例如：

{
  "/api": {
    "target": "http://localhost:3000",
    "secure": false,
    "logLevel": "debug",
    "pathRewrite": {
      "^/api": ""
    },
    "changeOrigin": true
  }
}

以上配置是将所有以 /api 开头的请求代理到本地的 http://localhost:3000 服务器。其中：

• target 表示代理的目标服务器；
• secure 表示是否使用安全链接；
• pathRewrite 表示重写被代理请求的路径，例如将 /api/users 重写为 /users；
• changeOrigin 表示是否修改请求头中的 origin 字段，解决跨域问题。

通过配置前端代理，可以轻松地解决前端跨域问题，提高开发效率。