服务器端生成的 JavaScript 响应

Basecamp中的大多数Ajax操作都是在处理服务器生成的JavaScript响应(SJR)。它的工作原理是这样的:

  1. 表单通过一种XMLHttpRequest驱动的形式提交。
  2. 服务器创建或更新模型对象。
  3. 服务器生成包含了针对该模型对象的更新了的HTML模板的一个JavaScript响应。
  4. 客户来评估处理由服务器返回的JavaScript,然后会更新DOM。

这种简单的模式有一些重要的优势。

优势 #3: 容易跟踪执行流

使用SJR会让跟踪执行流变得非常容易。请求的机制是标准化的,是会带有辅助逻辑“likeform_for @post, remote: true”. 当然没有必要对于每个动作都带上辅助逻辑。 接着控制器会以渲染完整视图的方式来渲染响应中的部分视图,其中的目标只能是JavaScript 而不是完全的HTML

完整示例

0)首先使用消息模板

<h1>All messages:</h1> 


<%# renders messages/_message.html.erb %> 


<%= render @messages %> 

1) 以Ajax方式提交表单.

<% form_for @project.messages.new, remote: true do |form| %> 


  ... 


  <%= form.submit "Send message" %> 


<% end %> 

2) 服务器创建模型对象.

class MessagesController < ActionController::Base 


  def create 


    @message = @project.messages.create!(message_params) 


 


    respond_to do |format| 


      format.html { redirect_to @message } # no js fallback 


      format.js   # just renders messages/create.js.erb 


    end 


  end 


end 

3) 服务器产生内嵌入HTML的JavaScript响应.

<%# renders messages/_message.html.erb %> 


$('#messages').prepend('<%=j render @message %>'); 


$('#<%= dom_id @message %>').highlight(); 

最后评估响应工作是由form_for产生的XMLHttpRequest-powered表单来自动处理的。视图因此由于新消息而更新,此外新消息也通过JS/CSS动画高亮显示

相关推荐