使用 Gulp 远程服务器上的 BrowserSync 代理？

Question

我有一个远程 Linux 服务器，我正在运行一个 Node.js 应用程序，它通过 http://www.example.com 的 nginx 代理。

我安装了带有 BrowserSync 的 gulp（用于 SASS 编译）。每当我在服务器上启动 gulp 时，访问 url 是这样的：

[BS] Access URLs:
 ----------------------------------
       Local: http://localhost:3000
    External: http://10.0.2.15:3000
 ----------------------------------
          UI: http://localhost:3001
 UI External: http://10.0.2.15:3001
 ----------------------------------

所以，这是行不通的，因为我没有尝试通过 localhost 访问服务器。我需要通过它的实际 url 访问它：http://www.example.com。当我浏览到http://www.example.com 时，我可以在页面中看到 BrowserSync 没有注入到页面中。

我一直在搞乱 BrowserSync 代理选项，但它们并不清楚。我在gulp 任务中尝试了以下操作：

browserSync.init({
  proxy: {
    target: 'http://www.example.com:4000'
  }
});

然后我得到了这个：

[BS] Proxying: http://www.example.dev:4000
[BS] Access URLs:
 ----------------------------------
       Local: http://localhost:3000
    External: http://10.0.2.15:3000
 ----------------------------------
          UI: http://localhost:3001
 UI External: http://10.0.2.15:3001
 ----------------------------------

但是 4000 端口没有在防火墙上打开，所以这不起作用。这是正确的方法吗，我只需要打开那个端口吗？为什么它不能与端口 80 一起使用？还是我在这方面做得不够好？

Answer 1

试试这个生成器：

https://www.npmjs.com/package/generator-angular-proxy

它完全符合你的要求......