-
1 votesanswersviews
使用webpack-dev-server读取webpack资产json
到目前为止,我一直在使用webpack构建我的同构Node / Express / React应用程序并通过在我的索引html文件中包含以下内容来提供我的bundle.js而没有任何问题: <script src='/bundle.js'></script> 但是,为了部署到 生产环境 ,我发现我需要一个缓存破坏机制,所以我到达webpack-manifest-plugi... -
0 votesanswersviews
如果需要来自第三方API的数据,如何从next.js导出静态HTML页面?
我正在使用next.js到build static HTML webpages . 我的一个网页需要来自第三方API的数据,我想在构建时获取数据并将其烘焙到生成的HTML中 . 我不希望这个调用永远发生在客户端上,因为: CORS无论如何都会阻止请求成功 我必须在客户端公开API密钥(不,谢谢) 我认为 getInitialProps 就是答案,因为获取的数据确实在构建/导出过程中被烘... -
55 votesanswersviews
React renderToString()性能和缓存React组件
我注意到,在服务器上渲染大型组件树时, reactDOM.renderToString() 方法开始显着减慢 . 背景 一点背景 . 该系统是完全同构的堆栈 . 最高级别 App 组件呈现模板,页面,dom元素和更多组件 . 查看反应代码,我发现它渲染了~1500个组件(这包括任何简单的dom标记,它被视为一个简单的组件, <p>this is a react component<... -
0 votesanswersviews
当UI在同构反应web应用程序中发生更改时,HTML标记不会更改
我正在使用react来创建一个样本页面,该页面使用 renderToString() 进行SEO友好页面的服务器端渲染 . 这是我的server.js代码 app.get('*', (req, res) => { match( { routes, location: req.url }, (err, redirectLocation, renderProps) =>... -
1 votesanswersviews
使用React路由器时出现此错误TypeError:type.toUpperCase不是函数
我正在使用react和express.js开发一个同构应用程序 . 我正在使用React Router进行客户端路由 . 在运行应用程序时,我在控制台中收到错误和警告 Warning :propType失败:提供给 Route 的 object 类型的无效道具 handler ,预期 function . Warning :提供给 UnknownComponent 的 object 类型的未定义... -
0 votesanswersviews
React-router v1.0;将道具传递到服务器上的应用程序
在react-router 0.13中,您可以将props传递到路由处理程序中 serverApp.get('/*', function(req, res) { Router.run(AppRoutes, req.url, function(Handler, state) { var markup = React.renderToString( <Handler pa... -
3 votesanswersviews
使用React路由器的服务器端身份验证流程
我想知道如果我的应用程序正在渲染服务器端,如何使用React Router精确实现身份验证流程? 场景: 当用户第一次到达应用程序时,我们调用 onEnter 路由器方法以检查是否存在任何当前用户( localStorage ),如果他们是,我们将其重定向到他们的仪表板,否则我们将它们重定向到登录页面 . 因此,当我的应用程序访问我的受保护路由 onEnter 时,理想情况下应该发生什么: onE... -
0 votesanswersviews
使用React Rails预呈现React组件
我有一个简单的React组件,当前在客户端上正确呈现 . 我试图让它在服务器上呈现 . 为了测试这一点,我将关闭Chrome中的JavaScript并加载页面 . 我的组件看起来像这样: window.TestComponent = React.createClass({ render: function() { return React.DOM.h1({className: 'T... -
3 votesanswersviews
Firebase身份验证状态在客户端上持续存在,但不会在硬刷新时持续存在
我正在构建一个使用Express来处理服务器请求的同构React应用程序 . 在客户端运行捆绑的React应用程序时,我的Firebase登录流程运行良好: 我使用Firebase的电子邮件/密码选项登录 认证后, ref.getAuth() 成功返回用户的auth对象 在我的应用程序客户端(通过react-router)导航时对 ref.getAuth() 的后续调用也会返回一个成功... -
1 votesanswersviews
Reactjs在第一页加载时不从数据库加载动态内容
我是ReactJS的新手,并使用NodeJS和Express构建一个小型SPA应用程序 . 我的要求是在初始页面加载中从mysql加载数据 . 脚本看起来像这样: /** @jsx React.DOM */ var React = require('react'); var Request = require('request'); var HomePage = React.createClas... -
2 votesanswersviews
React JS同构渲染
ReactJS,原始Flux,react-router,nodeJS,socket.io一切都是最新的 . 如果我在浏览器中关闭javascript,则只呈现静态代码 . 在服务器端渲染 ComponentWillMount 和 render 方法被激发,但不是 ComponentDidMount .即使我将Flux逻辑放入 ComponentWillMount 方法,也没有任何反应:调用act... -
0 votesanswersviews
Q关于同构Javascript - 为什么它不会在页面上加倍?
好吧,这个问题可能会揭示对经典HTML / javascript组合的基础知识的误解,但是这里...... 假设我有一个(相对)简单的应用程序,它利用同构Javascript的概念,首先在服务器端渲染,然后由浏览器渲染 . 例如,这一个: https://github.com/jesstelford/react-isomorphic-boilerplate 该应用程序首先呈现以下服务器端(通过re... -
0 votesanswersviews
修复Handlebars在isomorphic JS app中编译问题
我已经创建了一个概念证明,可以使用依赖项来查看here . 问题是:Handlebars compile() 在服务器和客户端上的行为不同,因为这些平台上的模板需要/导入不同 . var view = require('someView.hbs'); var data = {}; var content = isServer ? view(data) : handlebars.compile(v... -
41 votesanswersviews
React Flux和服务器端渲染? (同构反应磁通)
使用同构应用程序设置应用程序的初始状态的一般做法是什么?没有Flux我会简单地使用类似的东西: var props = { }; // initial state var html = React.renderToString(MyComponent(props); 然后通过express-handlebars渲染该标记并通过 {{{reactMarkup}} 显示 . 在客户端设置初始状态我会... -
0 votesanswersviews
如何在服务器和客户端上完全呈现反应组件?
我需要制作ES6同构javascript应用程序,它可以在第一次请求时在服务器上呈现整页数据(或者在客户端上使用w / o js),并使用客户端呈现进行导航 . 有两个模块可以进行异步渲染 - react-async和react-nexus . React Async可以从React组件发出XHR请求,但是需要节点光纤插件,React Nexus可以进行服务器端Flux存储,而我无法理解how... -
2 votesanswersviews
带有babel-loader的Webpack反应腐败图像文件
我正在使用带有babel-loader的webpack来转换.jsx反应文件 . 但是,添加文件加载器或样式和css-loader无法正确处理react组件或样式表中的required()图像 . 它们被webpack识别并复制到dist文件夹 . 图像文件的路径是正确的,我在css和js输出中验证了这一点 . 服务器也能够显示文件,我已经检查了一些手动复制的文件 . 发生的事情是图像本身被破坏了... -
4 votesanswersviews
同构/普遍呈现React 15应用程序中断Cloudflare HTTP代理(“橙色 Cloud ”)
我有一个同构/通用React应用程序,这意味着它由服务器在服务器上呈现,为客户端,单页面应用程序用户体验提供支持 . 我配置此应用程序's DNS using Cloudflare, and use their 1875538 feature to accelerate and protect my site'的流量,如下图和in their support article所述: 从链接到文... -
1 votesanswersviews
在服务器和客户端上呈现不同的React路由器链接
我在渲染同构应用程序时遇到问题,当我不使用react-router(1.0.0-rc3)时它工作正常,但是当我介绍路由器时,特别是一个呈现链接的组件,如下所示: const React = require('react'); const Link = require('react-router').Link; module.exports = class About extends React.C... -
1 votesanswersviews
使用服务器端呈现时,React校验和失败
我构建了一个同构的反应应用程序,有时候元标记在服务器端没有自我关闭,我有以下无效的校验和错误: 您正在尝试使用服务器呈现将组件呈现给文档,但校验和无效 . 这通常意味着您在服务器上呈现了与客户端上不同的组件类型或道具,或者您的render()方法是不纯的 . 由于跨文档根目录渲染的跨浏览器怪癖,React无法处理这种情况 . 您应该在组件中查找依赖于环境的代码,并确保props与客户端和服务器端... -
4 votesanswersviews
用于Isomorphic React应用程序的OpenId Connect客户端架构
我正在开发一个基于微服务的大型项目,其业务功能分布在各种微服务上 . 我担心的是前端正在实施 isomorphic react redux spa app . 我们为单点登录功能实现了 OpenId Connect Provider (带有ASP.NET Core的Identity Server 4),因为我们的核心业务功能可以通过客户的第三方应用程序访问 . 我的 first question... -
0 votesanswersviews
每页上的React-router服务器端呈现
我正在尝试使用express和react-router构建一个同构应用程序,数据获取和首先渲染服务器端和数据操作客户端 . 我设法获取初始数据服务器端并呈现jsx组件,但只有在直接命中url而不是跟随链接时它才有效 . 事实上,就像我读过的所有示例一样,应用程序只进行一次服务器呈现,然后一切都发生在客户端 . 另外,如果我获取一些数据,渲染组件服务器端然后按照链接,则不会为新页面更新数据 . 我不... -
0 votesanswersviews
Redux getState在服务器上返回initialState
我正在构建一个同构反应应用程序,并在用户发送请求时执行以下任务: 1)假设用户命中 /about-us ,react-routers matchPath 找到适当的组件并返回它 .2)调用名为fetchData的静态函数,该函数调度动作 aboutPageContent() . 3)一旦在服务器上解析了promise,就会调用getState以获得更新状态 but it returns th...