Question

我正在使用Pusher向我的Rails应用添加实时页面更新。

以下是Pusher如何工作的简要概要（后来我将向您展示我希望它做什么）：

控制器：

class ThingsController < ApplicationController
  def create
    @thing = Thing.new(params[:thing])

    if @thing.save
      Pusher['things'].trigger('thing-create', @thing.attributes)
    end
  end
end

Javascript（在<head>...</head>中）：

var pusher = new Pusher('API_KEY');
var myChannel = pusher.subscribe('MY_CHANNEL');
myChannel.bind('thing-create', function(thing) {
  alert('A thing was created: ' + thing.name); // I want to replace this line
});

我想用ajax请求替换注释行以触发一些不引人注目的JavaScript。假设我有文件app / views / things / index.js.erb：

$("things").update("<%= escape_javascript(render(@things))%>");

我应该在myChannel.bind回调中写什么来触发上面的代码才能执行？

Answer 1

你并不是真的在这里比较苹果。

您正在将XHR请求中呈现的模板与things/index进行比较，将@thing对象的属性从POST更新为things/create。

您需要在Web浏览器中处理从Pusher返回的thing对象，并相应地修改DOM。

或者，更简单的解决方案可能是让控制器将格式化的HTML发送给Pusher而不是对象属性。然后你的javascript代码可以只插入格式化的HTML，而不是试图解析thing对象并手动修改DOM。

对@ user94154评论的回应：

免责声明：在你的问题之前，我从未听说过Pusher。

这确实会带来挑战b / c通常您的HTML在视图中被格式化，但您必须从控制器向Pusher发送数据。我可以想到几种方法：

如果HTML标记不多，您可能想要打破“不要重复自己”规则并在控制器中重复HTML标记并将其发送给Pusher
如果是很多标记，我会将我的视图生成代码抽象给帮助者。您也可以通过控制器呼叫帮助器。

在客户端，你应该有一个空的div（或一些DOM元素），它可以保存来自Pusher的HTML。并做这样的事情：

myChannel.bind('thing-create', function(thing) {
  $("div#thing_holder").html(thing.html);
});

Answer 2

http://blog.new-bamboo.co.uk/2010/5/12/integrating-pusher-into-a-complex-app-in-one-day

有点过头，但我认为这可能会让你走上正轨。

Answer 3

pjax可能就是你要找的东西。 README中包含了如何在Rails中开始使用它。

Answer 4

我明白，这是你怎么做的......

尝试在这里写它但是代码缩进等对于更长的东西不适用...

http://jbeas.com/ruby-on-rails/rails-3-pusher-app-and-unobtrusive-js/

将不引人注目的JavaScript与Pusher结合使用

4 个答案: