使用Express创build反应应用程序

我需要查询一个数据库,我正在使用create-react-app 。 连接到数据库( pg-promise )的库不能与Webpack一起使用,需要在节点服务器上运行。

所以我安装了Express并且有这个:

 app.get('*', (req, res) => { res.sendFile(path.resolve(__dirname, '..', 'build', 'index.html')); }) 

如何从React页面加载数据库中的数据? 我虽然使用request但我怎样才能请求我自己的服务器? 我应该添加到上面的代码行? 我认为它会是这样的:

 app.get('/query/:querybody', (req, res) => { // process and return query }) 

这是正确的吗? 我怎样才能使它与SPA一起工作?

可能最无摩擦的方法是在您的CRA应用程序旁边有一个单独的app.jsserver.js 。 您可以使用像并发这样的工具来运行您的React应用程序和快速应用程序。

诀窍是在不同于缺省值:8080端口上为您的快速应用程序提供服务。 通常8081是一个不错的select,因为在开发时使用相互靠近的端口号是一个常见的惯例。

在您的React应用程序中,您需要确保您使用快速端点的完整URL: http://localhost:8081/query/...

在服务器端,你需要正确的方向:你需要设置端点,它将根据请求响应数据。 在你的例子中,你为GET HTTP请求设置了一个端点。 如果您需要传递复杂请求(例如向数据库添加新logging),请考虑使用POST HTTP请求。

在客户端(在浏览器中),您将需要一个库来帮助您向服务器发送请求。 我可以推荐尝试Axios( https://github.com/mzabriskie/axios )。 通常,如果您省略协议,服务器名称和端口,请求将被发送到加载页面的服务器: http:127.0.0.1:8001/api/endpoint => /api/endpoint