Rails-如何在添加项目时强制刷新页面

Rails - how to force refresh page upon item added

本文关键字：刷新 项目 添加 Rails-      更新时间：2023-09-26

我正在制作一个简单的rails（3.2.11）演示，只有我才能访问。我有以下内容：

1） 一个名为Food 的轨道支架

2） 一个可以调用自定义路由/控制器的安卓设备，然后创建一个新的Food。（Food.create...）。

所以，在我电脑的浏览器上，我加载了http://myapp.com，它是rails应用程序的宿主。它立即加载所有食物，因为它正在渲染foods#index。然而，当我从安卓设备上调用创建一个新的Food时，（我电脑上的）浏览器页面仍然显示旧的食物列表，尽管数据库知道有新的食物。（因为目前我还没有刷新页面）

当Food表的数据库发生更改时，如何添加"侦听器/观察者"来自动刷新页面？这可能吗？

我不想找<meta http-equiv="refresh" content="5">，因为我想在整个30分钟的演示中打开我的电脑浏览器。

=====================

此外，我已经3年多没有使用过rails了，所以如果你愿意回答，请解释一下，让初学者能够理解？（首选明确的详细信息）

查看EventSource或WebSockets以进行实时开发。还有其他选择，比如长期投票。然而，如果您从同一页面添加新食物，您可以很容易地捕捉到该事件并刷新数据。

我建议去看看王菲。有一位优秀的Railscast详细介绍了如何设置它。

在过去，一个常见的选项是使用Juggernaut将数据从服务器推送到客户端。它甚至在websocket被广泛使用之前就已经被使用了，但最近它被弃用，取而代之的是HTML5服务器发送事件（SSE）。要使用SSE，您需要应用客户端侦听器，如下所示：

var source = new EventSource('/stream');
source.addEventListener('message', function(e) {
  console.log('Received a message:', e.data);
  //fetch new data with AJAX, or reload
  location.reload();
});

服务器端，有许多发送事件的方法。使用Cramp，发送事件是这样完成的（取自文档）：

class TimeAction < Cramp::Action
  self.transport = :sse
  #set the transport to Server-Sent Event
  on_start :send_latest_time
  periodic_timer :send_latest_time, :every => 2
  def send_latest_time
    data = {'time' => Time.now.to_i}.to_json
    render data
  end
end

如果你使用的是Sinatra，你的代码会是这样的：

get '/stream', :provides => 'text/event-stream' do
  stream :keep_open do |out|
    connections << out
    out.callback { connections.delete(out) }
  end
end

除Internet Explorer和Opera Mini外，大多数浏览器都支持服务器发送的事件，但也有一些回退/polyfill库，如here或here（jQuery解决方案）。与WebSocket不同，它们仍然使用HTTP协议，但请记住，它们是单向的，而WebSocket可以用于多向通信。如果您对SSE和websocket之间的区别感到好奇，请参阅此处。

相关文章：