自定义 ng 服务以代理对 /api 的调用？

Question

我使用 ng CLI 创建了一个新应用程序，效果非常好： ng new babysteps cd babysteps ng serve ng serve 使用 webpack 来 assemble 应用程序。为了全面测试它，我需要从我的 API 模拟服务器（特别是 POST 请求）提供 /api... 服务。我如何自定义使用的 Web 服务器，以重定向那个 URL 模式？

Webpack 开发服务器有 a proxy setting，但似乎 (?) ng serve 没有配置文件（或者我没有得到）。

我需要创建一个 webpack.config.js 或 create/edit 一些其他文件来代理吗？

Answer 1

您确实可以使用 angular cli 和 --proxy-config 标志将代理设置为后端。

这里或多或少是 documentation 的 copy-paste:

Say we have a server running on http://localhost:3000/api and we want all calls to http://localhost:4200/api to go to that server.

We create a file next to projects package.json called proxy.conf.json with the content
{
    "/api":
    {
        "target": "http://localhost:3000",
        "secure": false
    } 
}
[...]

and then we edit the package.json file's start script to be
"start": "ng serve --proxy-config proxy.conf.json"
and run it with npm start

自定义 ng 服务以代理对 /api 的调用？

Customise ng serve to proxy calls to /api?

webpack

webpack-dev-server

angular-cli

angular