多个React应用程序通过单个redux存储进行通信

Question

背景故事：目前我的公司有一个“门户”，其中许多不同的内部应用程序是独立开发的，然后被归入网站。帧之间存在大量的喋喋不休（通常检查状态或为其他应用程序设置某些状态），这些都在同一域（不是跨域）上托管。这种方法很好但最近我们正在考虑转向redux，因为这种方法看起来很脏，而且各个团队在window.top（全局）上抛出了大量数据。 像redux这样的东西是否能够以比window.top上的读取和设置变量更均匀的方式处理多个“应用程序”“通信”，或者这是对redux的不当使用？

Answer 1

帧具有不同的上下文。您必须引用父商店，例如，通过dispatch公开商店（及其window）。它可以说比随机的各种变量更清晰。

那说：如果他们是真正独立的应用程序，那么我可能选择通过后端（Elixir，Node等）提供的实时更新通过每个框架中的网络套接字真正独立。 ＃39; s非常适合这项任务。

这样做可以更灵活地分离出应用程序（例如，我只想让app Foo在自己的窗口中运行），将帧间通信发送到公共总线上，以便其他任何想要查看的内容这些消息可以等等。

Answer 2

是的，您确实可以在顶级页面中拥有一个共同的Redux商店并向其发送操作。但是，如果您希望不同的iFrame听取更新，那么您需要一些Redux中间件来观察状态更改并允许iFrame订阅这些事件。

我希望尽管这可能会使你的代码结构更好一些，如果你有很多不同的团队，那么所有猴子都会修补一个Redux商店，你的代码会很快变脏。

我建议有一个pub / sub库，比如顶级页面中的postal.js，用于在不同的应用程序之间传递消息，然后为共享数据创建一个简单的名称间隔对象存储，并保护它免受错过使用使用无缝不可变库。

Answer 3

  

这种方法很好但最近我们正在考虑转向   redux因为这种方法看起来很脏，而且各种团队都在辗转反侧   window.top（全局）上的数据。

当事情发生时，我会考虑清理代码或实现redux。我通常避免在全局或窗口上存储任何内容。

如果

，我强烈建议实施redux

• 贵公司将暂时使用此门户
• 你想学习redux（它真的很酷）
• 团队中的某个人已经熟悉redux

为什么选择redux？

• 如果你在多个视图或框架中跟踪状态，那么它对所有状态使用单一事实来源都是很好的
• 超级模块化，乐于在团队环境中工作

根据您的描述，您的redux似乎是您问题的完美解决方案。

Redux非常简单，但是根据你的技术堆栈的其他部分，你可能需要使用某种带有redux的中间件。