firebase - 如何让我的 Vue.js webpack 项目和 Firebase 功能在同一个端口上运行？

Question

Vue.js 和 Firebase

我有一个有趣的情况，我通过 vue cli 安装了一个 vue.js webpack 项目，以及一个具有托管和功能的 Firebase 项目(一个节点 express 应用程序)。

端口 8080 和 5000

现在，如果我使用 npm run dev 运行 Vue 项目，那么 Vue 项目将在 localhost:8080 上构建和运行。这很好。它有热重载，它运行并做它需要做的事情。

但是，我希望 Vue 项目将 Firebase 的函数用于其后端 API 调用。遗憾的是，Firebase 在 localhost:5000 上运行。

同源策略违规

当然，我可以使用 JSONP，但这很愚蠢，因为除了由于此端口不匹配而给开发人员带来便利之外，没有其他理由使用它。

当我部署项目时，它会构建 Vue 项目，将/dist 文件夹推送到 Firebase，并且 Vue 前端和 Firebase 函数后端 (express) 在同一域的 80 端口上运行。因此，在生产中它很好。但是我想在开发的时候使用Vue项目的开发环境。

关于如何克服这个问题有什么想法吗？ 有没有办法让 Vue 在 :5000 上运行或让 Firebase 在 :8080 上运行？也许还有其他建议？

Answer 1

当你运行 firebase serve --help 时，输出是这样的:

Usage: serve [options]

start a local server for your static assets

Options:

-p, --port <port>   the port on which to listen (default: 5000) (default: 5000)
-o, --host <host>   the host on which to listen (default: localhost) (default: localhost)
--only <targets>    only serve specified targets (valid targets are: functions, hosting)
--except <targets>  serve all except specified targets (valid targets are: functions, hosting)
-h, --help          output usage information

请注意，您可以使用 --host 和 --port 更改服务位置。