Tag: reactjs

我可以使用React中的数据进行服务器渲染吗？

我正在做最近的反应。 我正在使用服务器呈现与react-router，但它只能从反应组件呈现HTML，我需要通过componentDidMount() ajax获取初始数据。 问题在于某些页面/组件，他们需要初始数据来呈现。 因此，如果用户直接访问这样的页面（通过inputurl或refresh），页面就会被破坏，因为服务器无法在没有初始数据的情况下渲染页面。 我想我可以从数据库中获取数据，并在服务器中渲染时插入到模板？ 就像经典的前端模板或PHP所做的一样。 如果没有办法，渲染首页数据的最佳做法是什么？ 现在我的服务器代码是这样的： router.get('*', function(req, res) { console.log('GET ADMIN'); match({ routes: appRoutes, location: req.originalUrl }, (error, redirectLocation, renderProps) => { if (error) { res.status(500) .send(error.message); } else if (redirectLocation) { res.status(302) .redirect(redirectLocation.pathname + redirectLocation.search); } else if (renderProps) { var content = renderToString(<RoutingContext {…renderProps}/>); var html = swig.renderFile('src/client/admin.html', { […]

具有REST API体系结构的单页面应用程序

我在Node.js构build了中等大小的Web应用程序。 起初，我没有计划，它会增长到中等规模，不知道它是否会被使用。 现在，随着客户的用户开始使用它，需要2个额外的function： 移动应用 单页应用程序 由于到目前为止我使用了服务器端模板（即所有我的API路由响应与HTML ），我需要作出巨大的改变，以支持API响应与JSON只是为了移动应用程序，所以我决定重构整个应用程序同时支持这两件事情。 通过一些在线资源（即Single Page App Book ）和比较可用的JavaScript框架（ Angular vs Backbone vs React vs Ember ），我得出结论如下。 我的问题是，我错过了什么？ 所以，这就是我打算如何扩展我的networking应用程序： 我将在React重写所有我的UI组件 所有当前的API路由仍然会以HTML响应，而HTML将使用服务器端React进行服务器渲染 ，但这些React UI组件也将包含在浏览器端，这将支持单页应用程序function。 我将编写特殊的REST API ，可能基于JSON API标准，以便服务器与单页面应用程序和移动Web应用程序进行通信。 两个API路由（ API响应页面 – HTML和数据 – JSON ）将使用Express路由器完成，该路由器将执行用于封装数据与数据访问层 （服务器组件）的组合操作的控制器 （服务器组件）。 数据访问层基本上由Mongoose模型组成。 由于这将需要更长的时间来执行和重构，我想确保我在正确的轨道上。 我在这里想念什么？

使用Express设置React路由器

关于使用Express设置React，我有几个问题。 首先，我为Express和React-Router使用了相同的路由path。 我认为这些应该是匹配的。 但是，当我导航到一个页面，api / blogPosts时，它只显示了我从MongoDB中获取的JSON格式的数据。 也就是说，Express路线将覆盖React视图。 我知道我可以在React-Router中修改路由path（例如，前面没有'api'），以便有不同的路由。 然后它会按预期显示React视图，同时仍然进行api调用。 但是，我认为路线路线应该是匹配的。 我应该如何正确处理这个问题？ 其次，我用express.Router（），我不知道这是必要的。 什么时候应该使用express.Router（），什么时候应该使用app.get，app.post等 第三，当人们讨论客户端路由时，他们正在讨论诸如React Router之类的东西吗？ 当人们讨论服务器端路由时，他们只是指像apiRouter调用那样对数据库进行api调用？ routes.js <Route component={App}> <Route path='/' component={Home} /> <Route path='/api/blogPosts/create' component={Create} /> <Route path='/api/blogPosts/:blogPostId' component={BlogPost} /> </Route> server.js var apiRouter = express.Router(); apiRouter.route('/blogPosts') .post(function(req, res) { var blogPost = new BlogPost(); blogPost.postbody = req.body.postbody; blogPost.save(function(err) { if (err) { return […]

使用PHP api服务器响应Web服务器

当Node / React Web服务器和PHP api服务器之间进行通信时，最好的做法是通过Web服务器“代理”客户端（React）的所有请求，而不是直接传递给api服务器？ 我使用通用（同构）React呈现在节点的Web服务器上。 它也将使用api服务器来构build初始页面加载（同构）。

React JS：console.debug不是一个函数

我正在运行一个ReactJsnetworking应用程序，我的web运行在webpack-dev-server中，但是在我捆绑我的代码之后，chrome / firefox控制台总是出现“Uncaught TypeError：console.debug不是函数”，我不知道如何解决这个问题。

使用现有的Java Web应用程序反应js

我打算在我现有的基于Java的Web应用程序中使用反应j作为V（来自MVC）。 我关心的是如何在java web应用服务器上运行react js组件。 React js使用Node js组件。 它有WebPack服务器捆绑代码到单个js文件（bundle.js）。 所以，我可以直接使用bundle.js（通过复制和粘贴）到我现有的应用程序？ 或者我需要别的东西？ 请build议。 谢谢。

如何在反应渲染函数内使用ejsvariables？

我将一个variablesabcd传递给我的index.ejs，然后调用一个响应js文件来呈现index.ejs页面。 我已经能够访问index.ejs中的<%= abcd %> ，但不能在react的render函数中访问。 你能帮我吗？ 谢谢

Webpack不能正确parsing我的别名

我试图让我的应用程序的名称空间作为模块工作，并使用此名称空间导入我的组件，并限制使用相对path。 尽pipe我在这里跟着别名的webpack文档： http ://webpack.github.io/docs/configuration.html#resolve-alias我不能使它工作。 这是我的解决scheme对象的样子： resolve: { root: path.resolve(__dirname), alias: { myApp: './src', }, extensions: ['', '.js', '.json', '.jsx'] } path.resolve(__dirname) /Users/Alex/Workspace/MyAppName/ui/ 我在文件/Users/Alex/Workspace/MyAppName/ui/src/components/Header/index.jsx中以这种方式导入我的文件： import { myMethod } from 'myApp/utils/myUtils'; 在构build过程中出现以下错误： ERROR in ./src/components/Header/index.jsx Module not found: Error: Cannot resolve module 'myApp/utils/myUtils' in /Users/Alex/Workspace/MyAppName/ui/src/components/Header @ ./src/components/Header/index.jsx 33:19-56 我也试过与modulesDirectories但它也不工作。 你有什么想法是错的？

发生了极小的exception; 使用非缩小的开发环境的完整的错误消息和其他有用的警告

我在浏览器控制台中得到这个错误。 在package.json中，我设置了这个 "start": "set NODE_ENV=development && node dev-server ./webpack/config", 但它仍然给同样的错误。我寻找缩小或最小的JS文件，但我找不到任何文件。它只是在项目import React from 'react';find这个import React from 'react'; 我该如何处理这个错误？我怎样才能使用非缩小的反应文件？ 我在NodeJS中是新的

PHP和node.js在同一台机器上进行通信的最快方式是什么？

我有一个Laravel应用程序正在使用node.js （express）服务器到服务器端渲染React页面。 这两个进程在同一台机器上。 目前Laravel使用一些初始数据（以JSON）向本地节点服务器发送POST请求，并从中接收呈现的HTMLstring。 POST请求目前需要100ms到200ms，而渲染本身如果平均执行20ms。 什么是其他80 / 180ms被花费？ 我曾尝试使用RPC的DNode，但延迟是可比的。