使用环回 REST API 时如何更改 gulp-angular 项目的端口号答案

【问题标题】：How to change the port number of the gulp-angular project when using loopback REST API使用环回 REST API 时如何更改 gulp-angular 项目的端口号
【发布时间】：2016-05-16 23:51:47
【问题描述】：

我正在做一个项目，在后端使用 loopback，在前端使用 angular。客户端是使用 gulp-angular 生成的。之后，我从环回添加了 lb-services.js。我遇到的问题是角度应用程序试图在我拥有gulp serve running 的同一端口上向 API 发出请求。我的环回应用程序在端口 3000 上，Angular 在端口 3001 上运行。

我如何告诉 Angular 在向 API 发出请求时更改端口号？

我试过像这样修改 gulp server.js：

  browserSync.instance = browserSync.init({
    startPath: '/',
    server: server,
    browser: browser,
    port:4000
  });

但这只会使 Angular 和它在 API 上发出的请求都在端口 4000 上运行，得到这个结果：

Angular 运行于： http://localhost:4000/

请求回送服务器：

http://localhost:4000/api/People

我想要的是：角运行： http://localhost:4000/

请求回送服务器：

http://localhost:3000/api/People

谁能帮我实现这个目标？

【问题讨论】：

标签： javascript angularjs loopbackjs

【解决方案1】：

您可以为 API 添加 rewriteRule 以将 URL 更改为 localhost:3000。如此处所示： https://www.browsersync.io/docs/options/#option-rewriteRules

您可以使用的另一个选项是：https://github.com/Swiip/generator-gulp-angular/blob/master/docs/how-it-works.md#proxy。您可以使用代理将 API 请求重定向到正确的 URL。像这样（取自 Github 示例）：

app.use('/api', proxy({target: 'http://localhost:3000/api', changeOrigin: true}));

【讨论】：

非常感谢您的回答。你能告诉我我必须把代理代码放在哪里才能让它工作吗？它是在服务器端还是在客户端？我应该搜索哪个文件来放置代码？非常感谢。
我已经在 gulp/server.js 上添加了这段代码：server.middleware = proxyMiddleware('/api', { target: 'http://localhost:3000/api', changeOrigin: true }); 但是我仍然收到发送到端口 4000 的请求
我不确定这一点，但也许这个链接对你有用：browsersync.io/docs/options/#option-serveStatic 其中包含更多关于如何做到这一点的信息。