简体繁体 English

节点和反应同构渲染架构

[英]Node and React Isomorphic Rendering Architecture

原文 2015-11-13 17:03:02 8 1 node.js/ apache/ nginx/ reactjs/ isomorphic-javascript

So I understand the fundamentals of isomorphic rendering with React / Node, but I'm confused on how I would fit Apache or NGINX into my landscape. 因此，我了解了React / Node的同构渲染的基础知识，但是我对如何将Apache或NGINX融入我的景观感到困惑。

Typically, with a client-side page I would just serve the static content from Apache or NGINX and the client-side page would make AJAX calls (which are reverse proxied through Apache or NGINX) to Node. 通常，在客户端页面中，我只提供来自Apache或NGINX的静态内容，而客户端页面将向Node进行AJAX调用（通过Apache或NGINX反向代理）。 Node would serve up the data and the page would change accordingly. 节点将提供数据，页面也会相应更改。

Looking at an isomorphic page with React, the page is initially rendered on the Node server and changes are served up to the client from the server. 使用React查看同构页面，该页面最初呈现在Node服务器上，更改从服务器提供给客户端。 Can I still use Apache or NGINX to load balance and reverse proxy my requests? 我仍然可以使用Apache或NGINX进行负载平衡和反向代理我的请求吗？

As an example, I would have one Node instance serving my API and one Node instance for rendering React and serving it to the client. 例如，我将有一个服务于我的API的Node实例和一个用于呈现React并将其提供给客户端的Node实例。 In this example, could I load balance, reverse proxy my calls, and serve my .js and .css bundles from Apache/NGINX? 在此示例中，我可以负载均衡，反向代理我的呼叫以及从Apache / NGINX提供我的.js和.css捆绑软件吗？ In this example the user would access www.example.com/ - that would first go to the Apache/NGINX which would reverse proxy the call to the Node server which would render the page and serve it up to the client. 在此示例中，用户将访问www.example.com/-首先将其转到Apache / NGINX，这将反向调用代理到节点服务器，该服务器将呈现页面并将其提供给客户端。 Then, on the page the client would click some button and access www.example.com/api/test and that would also go to Apache/NGINX and reverse proxy over to the second Node instance, which would server the data back to the client. 然后，客户端将在页面上单击某个按钮并访问www.example.com/api/test，这还将转到Apache / NGINX并将反向代理移交给第二个Node实例，该实例将把数据存储回客户端。 Or should that button click go back to the first Node instance (where rendering takes place) and that Node instance calls the second Node instance to get the data, renders the new piece, and serves it back to the client? 还是应该单击该按钮返回到第一个Node实例（发生渲染），然后该Node实例调用第二个Node实例来获取数据，渲染新片段并将其提供给客户端？

Basically I want an isomorphic app with all the benefits of having Apache or NGINX in front of my Node servers. 基本上，我想要一个同构应用程序，它具有在节点服务器之前安装Apache或NGINX的所有优点。 Is that possible and/or best practice? 那可能和/或最佳实践吗？ If not, what is the ideal landscape for an isomorphic app so that I can still maintain all the benefits of Apache or NGINX as my entry point to my webapp? 如果不是，同构应用程序的理想前景是什么，以便我仍然可以将Apache或NGINX的所有优点保留为Web应用程序的入口点？

1 个解决方案

Yes, that should all work fine. 是的，那应该一切正常。 The React/Node server just renders html, and is reverse-proxy-able like any other html backend. React / Node服务器仅呈现html，并且像其他任何html后端一样可以反向代理。

And yes, using a reverse-proxy/loadbalancer in front of your servers is a great idea, if you're planning on running something at scale. 是的，如果您打算大规模运行某项功能，那么在服务器前使用反向代理/负载平衡器是一个好主意。