Articles of reactjs

无法捕获并logging来自axios请求的错误响应

我在我的应用程序中有一个axios请求,为此我遵循axios npm文档。 这是我的axios请求 axios.post(helper.getLoginApi(), data) .then((response) => { console.log(response); this.props.history.push(from.pathname) }) .catch((error)=> { console.log(error); }) 我能够成功地在成功的请求上logging数据。 然而,当我故意产生一个错误,并尝试console.log它,我没有得到logging的结果,而我只是看到 POST http:// localhost:3000 / login 401(Unauthorized):3000 / login:1 错误:请求失败,状态码为401 login.js:66 在createError(createError.js:16) 在定居(定居点:18) 在XMLHttpRequest.handleLoad(xhr.js:77) 但是,当我在Chrome控制台中转到“networking”标签时,我可以看到下面的回复。 提前感谢您的帮助。

'AWSCognito'没有被定义

我已经使用以下示例在nodeJS中实现AWS Cognito,但是我正面临错误“'AWSCognito'未定义no-undef” 参考链接: https : //github.com/aws/amazon-cognito-identity-js/ 以下是我在App.js文件中的代码。 我使用了react-app。 import React, { Component } from 'react'; import logo from './logo.svg'; import './App.css'; import { CognitoUserPool, CognitoUserAttribute, CognitoUser } from 'amazon-cognito-identity-js'; class App extends Component { constructor(props, context){ super(props, context); this.state = { items: [] } } render() { const {items} = this.state; return ( <div className="App"> […]

Webpack的bundle.js内容

我开始学习webpack , node ,并react ,我对一些基本的工作人员有点困惑。 webpack是否webpack整个react.js +我的JavaScript文件捆绑到一个输出文件中,所以当部署到生产环境时,我不需要安装项目中使用的节点包 (假设它们被添加到webpack.config.js文件中)? 如果以上是正确的: 在我的服务器上,我只需要放置webpack( bundle.js )的index.html +输出? (在简单的情况下)? package.json将只用于开发方面?

在Netlify上部署Express时显示API路由

我用create-react-app创build了一个网站,我在./client/build构build并使用express 。 使用快递 ,我还设置了2个基本的API路由,在dev(localhost)中运行良好。 我在Netlify上部署什么 ? 我用react-scripts构build客户端 然后,我手动将环境设置为生产,以使用webpack在本地构build服务器 最后,我将代码推送到我的GitLab仓库,并自动触发部署。 使用Netlify部署的设置: Build command: Not set Publish directory: client/build 问题 当我尝试使用我的API路由之一,我得到一个错误404 … 项目 我的项目结构是这样的: | package.json | server.js | webpack.config.js +—API | dbHandler.js | routesHandler.js +—client | | package.json | +—src | | | App.js | | | … | +—node_modules | +—public | | index.html | […]

在更新状态之后,Reactjs不会复制我的消息

我正在关注这个博客的例子,这个问题在执行之后就引起了我的兴趣 https://github.com/DanialK/ReactJS-Realtime-Chat 总结一下,在通过websocket发送消息之前,消息的状态被更新。 当服务器接收到这个消息时,他们向所有的客户端发送广播,包括我自己。 Thereat,客户端用相同的消息更新状态 为什么这个消息不会出现2次? 我不希望这个消息出现两次,但我想知道为什么会发生 客户代码: socket.on('send:message', this.messageRecieve); … handleMessageSubmit : function(message){ Messages.push(message); this.setState({ messages : Messages }); socket.emit('send:message', message); }, messageRecieve: function(message){ Messages.push(message); this.setState({ messages : Messages }); }, 服务器代码: socket.on('send:message', function (data) { socket.broadcast.emit('send:message', { user: name, text: data.text }); });

如何正确地将反应导入到node-webkit应用程序中?

我正在尝试创build一个node-webkit应用程序,并且我想使用react.js作为我的框架。 尝试反应并创build一些组件后,我尝试在node-webkit应用程序中按以下方式使用它: 'use strict'; require('react'); 每当我打开我的node-webkit应用程序,其中包括上面的脚本在身体的末尾我得到的错误: ReferenceError: document is not defined at Object.<anonymous> (C:\Users\rtol\Dropbox\Code\Node- Webkit\WallpaperManager3.0\node_modules\react\lib\CSSPropertyOperations.js:31:7) …. 难道我做错了什么? 我发现的所有文档都表明,这将是使用节点时包含反应的正确方法。 我有npm安装反应,根据package.json它是版本0.13.2。 例如, react-nodewebkit入门工具包的index.jsx如下所示。 var React = require('react'); var HelloWorld = require('./components/HelloWorld.jsx'); React.render(<HelloWorld />, document.getElementById('content')); 所以我不知道为什么它不起作用。

nodejs reactjs和webpack,configuration是错误的,但是什么?

我知道有一大堆的资源描述了这个设置,我尝试了几种方法,但是它的速度正在发生变化,所以我的谷歌示例已经过时了 – 这里 package.json { "name": "scoreboard", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC", "devDependencies": { "babel-core": "^6.3.15", "babel-loader": "^6.2.0", "babel-preset-es2015": "^6.3.13", "babel-preset-react": "^6.3.13", "babelify": "^7.2.0", "react": "^0.14.3", "react-dom": "^0.14.3", "webpack": "^1.12.9" } } 这是我的webpack.config.js module.exports = { context: __dirname […]

在NodeJS中执行webpack编译的包

我想为我的ReactJS应用程序实现服务器端渲染。 我使用react-router 。 我把routes.js作为webpack入口点,并使用output.libraryTarget = "commonjs2"选项进行编译。 然后我需要在NodeJS脚本中编译的结果进行渲染。 但是我有错误。 Webpack在以下代码中打包模块: /* 277 */ /***/ function(module, exports, __webpack_require__) { /* WEBPACK VAR INJECTION */(function(Buffer, global) { if (global.foo) { /* … */ } /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(277).Buffer, (function() { return this; }()))) /***/ } 当NodeJS尝试执行(function() { return this; }())它的返回值undefined 。 在浏览器中将返回window 。 为什么webpack使用这样的包装代码? 如何使这个代码在NodeJS中工作? 我使用节点克隆作为外部库。 […]

TypeError:从Redux使用连接时_this.store.getState不是函数

当我第一次运行服务器node app.js一切都很好,我listening on 5050然后我去localhost:5050 /,我得到这些警告在服务器运行的控制台。 Warning: Failed propType: Required prop `store.subscribe` was not specified in `Provider`. Warning: Failed Context Types: Required child context `store.subscribe` was not specified in `Provider`. 该组件呈现罚款那里,但一旦我去本地主机:5050 / ballerviews我得到这个在服务器上 TypeError: _this.store.getState is not a function at new Connect (/Users/freddiecabrera/Desktop/ullibol-client/node_modules/react-redux/lib/components/connect.js:133:38) at [object Object].ReactCompositeComponentMixin.mountComponent (/Users/freddiecabrera/Desktop/ullibol-client/node_modules/react/lib/ReactCompositeComponent.js:148:18) at [object Object].wrapper [as mountComponent] (/Users/freddiecabrera/Desktop/ullibol-client/node_modules/react/lib/ReactPerf.js:66:21) at Object.ReactReconciler.mountComponent (/Users/freddiecabrera/Desktop/ullibol-client/node_modules/react/lib/ReactReconciler.js:37:35) […]

什么服务器端代码使用React应用程序

我目前正在学习React,并已经设法了解前端。 为了便于学习,我开始使用使用Webpack&Babel的create-react-app锅炉板。 我现在正处于我想与用户上传文件和其他帐户相关活动(如“喜欢”列表中的某些项目)的一些交互的阶段。 我已经将Firebase作为我的数据库进行身份validation,并且有一些关于文件存储和处理用户与Web应用程序交互的问题: 传统上,我一直在使用PHP来处理用户请求。 IE的用户会发出一个AJAX请求与目标文件是一个PHP文件,将采取发布的数据,然后继续进行数据库更新或张贴上传的文件到服务器。 我应该使用与我的React应用程序相同的方法吗? 我猜如果我使用这种方法,这将意味着我将在节点服务器上托pipe我的应用程序的可视化部分,并且在PHP服务器上处理任何php文档来处理ajax请求? 似乎很受欢迎的替代方法是使用Node.js来处理与我的数据库的用户交互。 我可以发布类似的Ajax请求到节点文件,而不是php文件,以便进行数据库更新或file upload? 这样做通常是安全的吗? 道歉,如果这些问题听起来有点菜鸟,这是很多新的东西学习,我正在尽我所能,让我的头缠到它! 谢谢