使用 Rails 保持前端状态答案

【问题标题】：Keep front-end state with Rails使用 Rails 保持前端状态
【发布时间】：2019-11-25 13:21:18
【问题描述】：

我有一个 Rails 应用程序，如果用户登录，我想保存我的 div 的状态。

示例：有人登录并单击 div 以隐藏它。我希望将其存储在某个地方，因此如果他再次打开该页面，该 div 仍将被隐藏。

我不想使用本地存储，因为如果我也使用移动设备或其他计算机/浏览器，我希望保存状态。它需要在任何地方都相同，具体取决于用户。

我正在考虑在我的用户模型中将每个 div 的每个状态存储为布尔值，但这个想法听起来一点也不干净，如果我这样做，我认为我将无法在晚上睡觉

有什么想法吗？我认为 React/Redux 可以轻松处理这个问题（也许不是，而且它也是本地的？）但目前我被 Rails 困住了..

非常感谢！

【问题讨论】：

Redux 内存不是持久化的，它们使用 cookie 或 localStorage 来保存数据。您可以使用不同的用户模型（如“用户元数据”或“用户自定义”）并在需要时检索信息
好的，很高兴知道。我看到 Redux 的唯一区别是 JS 是异步的，而 Ruby 不是。因此，如果我实现这一点并让 100.000 个用户点击 div，它可能会变得超级慢，不是吗？
是的，它可能很慢，因为它们是发送到后端的 100.000 个操作。这就是为什么通常你有一个 localStorage 或 cookie 来保存这些信息
是的，JS 还是会更快，因为它不会一一等待：/ 谢谢，我会考虑的
@Jessicascn 我发布了一个答案，因为我有很多想法，如果没有描述，我无法在此处添加它们。关于您的 100K 用户单击 div 问题，您可能需要具有异步功能，并且对于 Rails 也很容易。不需要 React。

标签： javascript ruby-on-rails ruby local-storage

【解决方案1】：

React/Redux 不会拯救你，因为除了一些方便的绑定之外没有任何神奇的事情发生。在幕后，他们使用相同的“浏览器功能”。

恐怕您需要找到最适合您的折衷方案。我会发布一些想法：

坚持本地存储

既然你已经调查过了，这里可能不需要多说。

绑定到 Chrome

自 Chrome 25 起，他们提供了对storage.sync 的访问权限，您可以围绕此开发您的系统。如果有任何数据，请始终尝试检索数据，然后记住保留新数据并同步它。也许其他浏览器支持这一点，但缺点是您也必须拥有这些代码。

使用 webRTC 进行实验

您可以使用 webRTC 在两个浏览器之间传输数据。虽然我在这方面没有太多经验，但我不能推荐它，但它绝对是您想要考虑的一种方法。

也许检查一下这个项目：https://github.com/cjb/serverless-webrtc

创建您自己的存储空间

拿起一个存储（我认为即使是 firebase/dynamodb 也可以）并构建一个系统来保存用户偏好。如果您有 Auth0，则可以在其中保留一些逻辑，并且由于他们提供 SSO，因此检查这些自定义设置将相当容易。

请记住，由于您不想使用 localStorage，因此您需要保持会话并将此首选项保存在 user_id 或其他名称下。

在我看来，没有最好的解决方案，只有你想交易的东西才能支持它。如果您不介意保留整个业务逻辑，我不明白为什么为此创建存储会使其太慢。测量负载并一路优化。

【讨论】：

您好，非常感谢，我去看看！当您在评论中说“您需要异步”时，您如何使用 Rails 实现它？我什至不知道这是可能的，这太棒了！
根据经验水平，有多种选择。我认为最简单的方法是对控制器操作进行一些 JS 调用，并使用 ActiveJob 将作业排入队列以保持更改。更高级的替代方法是并发红宝石 gem。

【解决方案2】：

听起来这是一种用户偏好类型的配置。因此，您可能只需将设置存储为用户模式中的单个字段。为此，您可以使用可序列化的哈希或 json 类型。

所以假设你有一个app/models/user.rb

添加运行迁移

rails g migration add_view_options_to_users view_options:text
rake db:migrate

将此添加到您的模型中

class User < ActiveRecord::Base
  serialize :view_options, Hash
end

然后在您的用户控制器中，您可以发布到您的更新操作，因此您需要向permitted_params 添加一个字段

private

def permitted_params
  params.require(:user).permit(:view_options, #other options etc.)
end

如果您愿意，您需要从这里编写一些 javascript 来将 view_options 发布给用户/更新或自定义路由。但基本上每个字段的值都将保存在控制器操作中，例如：

def update
  @user = User.find(params[:id])
  opts = @user.view_options || {}
  user.view_options = opts.merge(params[:view_options])
  if @user.save
    render json: { status: true, user_id: @user.id }
  else
    render json: { status: false, errors: @user.errors.full_messages }
  end
end

【讨论】：