如何在同一端口上运行Node Express服务器和Angular？

我是Node和Angular的新手。我需要知道是否可以在同一端口上运行Node Express应用程序作为后端和Angular前端。我遵循angular.io上的Angular Quickstart提示并创建了一个Node todo应用程序，但都在不同的端口上运行，这引发了跨源请求被阻止问题。如何在同一端口上运行Node Express服务器和Angular？

来源

2017-06-03 Swapnil Deo

我建议你不要使用express或node.js来提供静态内容（包括AngularJS应用程序）。 –

为了让Angular和Express在同一个端口上运行，我一直都使用Express应用程序本身为我的Angular构建文件提供服务。你应该能够告诉快递从一个角度构建目录像这样提供静态内容：

-accounting-server 
    -serve.js 
-accounting-client 
    -dist/*

：

app.use(express.static('../accounting-client/dist'));

，如果你有像这样的文件结构，并用节点运行serve.js这会工作

通过将Angular build文件夹配置为您需要的任何位置，您可以根据需要进行自定义，或使用Grunt/Gulp将文件移至您使用构建任务所需的文件夹。

正如雅科夫所提到的，这对开发并不理想，因为它不适用于Angular dev服务器的自动刷新。

来源

2017-06-03 14:29:57 SpaceFozzy

要使Node.js在同一端口上提供Angular应用程序，您必须将Angular应用程序部署在部署静态资源的Node目录下。但是在开发模式下，从开发服务器上为您的Angular Bundles提供服务（例如在您编写代码时在内存中自动重建）会更有效率。在端口4200上，而节点服务器在另一端口上运行，例如， 8080.

为避免出现跨站问题，您需要在Angular应用程序中配置一个简单的代理文件，以将所有数据请求重定向到您的节点服务器。例如，在你的角项目的根目录创建一个文件代理conf.json：

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

这将重定向必须在URL/API到您的节点服务器假设它运行在所有的请求端口8080。然后使用以下命令启动角应用：

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

在角应用的HTTP请求可以是这样的：

http.get('/api/products');

当然，您需要为您的节点服务器上的GET请求配置/ api/products端点。

来源

2017-06-03 14:24:51

非常有用！谢谢。 – SpaceFozzy

你好雅科夫，我在这里的视频教程链接https://www.youtube.com/watch?v=PFP0oXNNveg。你能检查它并恢复吗？ –

我通过制作配置文件添加上面的代码，当我运行ng-serve时，我总是收到以下错误“构造函数（_configPath，schema，configJson，fallbacks = []）” –

事实上，您需要从Express项目中访问您的客户端项目，如spacefozzy所述，这是事实。但你仍然可以保持你的项目分开。
要做到这一点，你可以在你的快递项目目录创建一个从您的客户端项目目录符号链接：

// while in Express directory 
ln -s ~/path/tp/client-side/build name-in-espress-dir

这样你就可以保持孤立的项目。

来源

2017-08-06 08:59:07 Reyraa

如何在同一端口上运行Node Express服务器和Angular？

回答

相关问题