通过代理重定向Angular2 http请求

Question

我正在使用angular-cli bootstrapper 创建Angular2应用程序并webpack-dev-server用于调试目的.

对于某些类型的http请求,我想使用webpack-dev-server 代理支持将它们重定向到另一个后端.

出于这个原因,我创建了proxy.conf.json文件:

{
  "/api/**": {
    "target": "http://localhost:4201",
    "secure": false
  }
}

并映射angular cli以使用此配置文件:

ng serve --proxy-config proxy.conf.json

启动控制台消息后通知我代理创建成功:

NG Live Development Server在http:// localhost:4200上运行

创建代理:/ api/** - > http:// localhost:4201

但是所有请求http://localhost:4200/api/users始终返回404状态代码.我尝试了许多映射网址的例子,但没有任何帮助:

"/api/users" -> "http://localhost:4201/users"
"/api/" -> "http://localhost:4201/"

来自我的代理服务器的数据正在请求成功.我做错了什么？

Answer 1

我找到了解决方案 我创建了简单的快速服务器来记录从代理服务器传输的所有请求,以检查映射的工作方式.我发现我对映射有错误的理解.

而不是配置文件中定义的严格映射:

/api/users => http://localhost:4201/users

使用下一个规则的webpack代理服务器映射:

/api/users => http://localhost:4201/users/api/users

所以这里的解决方案是添加pathRewrite参数以排除前缀

{
  "/api/users": {
    "target": "http://localhost:4201",
    "secure": false,
    "pathRewrite": {"^/api" : ""}
  }
}