node.js - 从数据库中获取数据的正确方法是什么?
问题描述
我有一些带有授权的简单反应应用程序,它是通过 - jwh 令牌和 Redux 魔术代码完成的,我无法理解这一点(如果可能的话,希望不要接触该技术 - 真的不喜欢它,太模糊和复杂- 为新手编写风格)。但那是歌词了。
所以登录后,一些令牌被保存在某个地方,发生了一些神奇的事情,这有两个后果:现在我有我user.id
的 in props.user
,并且可以使用 axios 调用 api 端点(通常没有身份验证不可用)。
现在我有用户登录历史表,我想在页面上显示与用户关联的数据表。我应该在哪里获取数据库?我发现最新的最简单方法是在方法中轮询后端 api(轮询 mongoDb)componentWillMount()
。然后我可以访问 , 中的数据render()
来显示用户表。那是对的吗?还是我被迫以某种方式与 Redux “同步状态”?要不然是啥?我迷失在范式中..
PS。轮询有效,但如果数据由另一个用户动态更新,我看不到关于他登录的更新(没有刷新页面)。
解决方案
如果可能的话,我建议您首先在不使用 Redux 的情况下制定基本逻辑,范式需要时间才能融入 - 如何以及为什么使用它们等。其次componentWillMount
是(将被)弃用,而且它从来都不是这个地方提出数据请求但是componentDidMount
(如文档中所述)。
React 做事的基本方法是调用请求,componentDidMount
然后将响应放入组件状态,通过setState
这将导致使用新数据重新渲染。使用 Redux,你可以做类似的事情,你在同一个地方分派动作,动作调用请求,然后通过reducer将响应放入全局状态。但是,要让组件更新状态更改,它需要订阅状态的那部分。最简单的方法是使用react-reduxconnect
中的高阶函数包装组件,并通过对象将那部分状态作为 prop 传递给组件。mapStateToProps
如果所有这些与仅具有本地组件状态相比听起来很多,那就是,这就是为什么我建议首先尝试在没有 Redux 的情况下实现逻辑。这些额外的步骤在大型项目中有它们的优点,在这些项目中,拥有一个全局状态而不是在整个地方传递处理程序和一个用于状态的大型容器组件是有益的,但它带有很多样板文件需要习惯。
现在你的问题的第二部分是,如果我没记错的话,当其他用户在其他地方更新数据时更新状态?这是网络上的一个典型问题,你不会用 React 或 Redux 解决它,因为它与它们无关,但需要不断检查变化。或者换句话说,您需要服务器通知您的 React 应用程序数据已更改的方式。
有几种方法可以做到这一点:
快速而肮脏的解决方案,您在组件中启动setInterval 计时器以不断发送请求并每X秒更新一次状态(只是不要忘记在组件卸载之前clearInterval 否则它将无限期地继续发送请求)
使用服务器发送的事件在数据更改时获取通知
将WebSockets或socket.io用于与服务器端事件相同的功能,或者您也可以移动所有数据通信以通过其中一项服务而不是标准 HTTP 请求
推荐阅读
- c++ - 你能颠倒初始化列表中参数扩展的顺序吗?
- paypal - 捕获沙盒 Paypal 智能按钮时出错 COMPLIANCE_VIOLATION
- regex - 正则表达式模式选择正确的子字符串,但在运行宏 vba 时抛出错误
- python - 我可以从 CCXT API 调用中获得原始交换响应吗?
- webrtc - 用户如何能够连接到转服务器而不是直接连接到 webtrc 机器?
- encryption - 是否存在任何现有的哈希算法,它给出一个字符串并返回一个整数?
- python - 如何在其序列化程序中使用模型字段
- python - GCP 存储 blob 上的单元测试
- nuxt.js - Vuex-Persistedstate 在重新加载时运行突变
- r - 根据 Shiny 应用程序中模块的输入禁用 UI 中的按钮