小编the*_*ill的帖子

同构JS - 仅限httpRequest客户端

关于同构通量应用程序中存储数据填充的问题.(我正在使用react,alt,iso和node,但理论适用于其他示例)

我有一个需要从api获取数据的flux'store '(http://alt.js.org/docs/stores/):

getState() {
   return {
       data : makeHttpRequest(url)
   }
}
Run Code Online (Sandbox Code Playgroud)

当用户浏览SPA时,将通过http请求加载更多数据.

我希望这个应用程序是同构的,以便我可以渲染应用程序完整的HTML,包括最新的数据服务器端,并将其返回给用户,以便快速初始页面加载.

react.renderToString()让我将应用程序渲染为html,我可以使用alt和iso播种数据,如:

storeData = { "MyStore" : {"key" : "value"}}; // set data for store
alt.bootstrap(JSON.stringify(storeData || {})); // seed store with data

var content = React.renderToString(React.createElement(myApp)); // render react app to html
Run Code Online (Sandbox Code Playgroud)

问题是我在运行js服务器端时会看到错误,因为商店想要发出一个它无法做的http请求(因为xmlhttprequest不存在于节点中)

什么是解决这个问题的最佳方法?

我能想到的唯一解决方案是从商店包装httprequest:

var ExecutionEnvironment = require('react/lib/ExecutionEnvironment');

    ...

    if (ExecutionEnvironment.canUseDOM) {
        // make http request
    } else {
        // do nothing
    }
Run Code Online (Sandbox Code Playgroud)

有更好的想法吗?提前致谢.

javascript flux node.js reactjs isomorphic-javascript

6
推荐指数
1
解决办法
564
查看次数