ruby-on-rails - 当后台发生其他事情时调用 ajax

Question

我试图在上传文件并解压缩时显示进度百分比。我正在使用 ruby​​-zip 来解压缩该文件。解压缩时，我增加计数器并将其存储在数据库中。我有一个像

这样的表格

<% form_tag '/unzip', :multipart => true do %>
  <%= file_field_tag "zipfile", :size => 12 %> 
  <button class="add_button" type="submit" value="Add"> Add </button>
<% end %>
<div class="progress">
</div>

在unzip操作中，有所有用于解压缩并将值存储在数据库中的操作。现在，我想每 2 秒左右更新一次 .progress div 。首先，我尝试在单击按钮时进行 ajax 调用，并调用另一个获取此进度的方法。但我没有成功，因为下面这个简单的代码给了我错误。

<script>
$(".add_button").click(function() {
  $.ajax({
    url: "/get_progress", 
    method: "POST"
  })
})
</script>

在 get_progress 方法中，我只是从数据库中取出值，如

def get_progress
  @progress = Progress.last.value
  respond_to do |format|
    format.js
  end
end

为了简单的检查目的，我只是在 get_progress.js.erb 中执行 console.log("rendered") 。但这永远不会被调用，因为它之前有错误消息。但是，我检查了一下，ajax 调用正在向 get_progress 发出请求。

但问题是，我在 jquery1.6.3 第 7948 行的 xhr.send((s.hasContent && s.data) || null) 中遇到错误。我想我得到了出现此错误是因为该页面在 ajax 调用期间被重定向到其他地方，并且在我进行调用时正在进行另一个请求，因为很明显，在提交表单时我调用了另一个操作。

当我通过执行以下操作打印出 ajax 调用的错误时:

error:function(xmlHTTPRequest, textStatus, errorThrown){
  console.log(xmlHTTPRequest);
}

我得到这个:

Object {readyState = 0 ,status = 0 ,statusText = "error" }

我认为我的问题与此类似question 。但是，这里提供的答案并没有解决我的问题。

有什么办法可以解决这个问题吗？我希望问题很清楚!

Answer 1

当我从 post 更改 ajax 调用时，这似乎对我有用。到 get .

查看:

Progress:
<div id="progress">
</div>

<br />

<button class="add_button" type="submit" value="Add"> Add </button>
<script>
$(".add_button").click(function() {
  $.ajax({
    url: "/get_progress", 
    method: "get",
    dataType: "script"
  })
})
</script>

Controller :

def get_progress
  @progress = Progress.last.value
  respond_to do |format|
    format.js
  end
end

get_progress.js.erb:

$("#progress").text("<%= @progress.to_s %>");

一些明显的需要检查的事情:

• 您已使用“get”操作添加了“/get_progress”的正确路线
• JQuery 已安装并正在运行
• get_progress.js.erb 中的代码正确。如果 JS 和嵌入式 Rails 逻辑无法正常工作，通常看起来就像“什么也没发生”。从上面这样简单的事情开始......

附注要循环运行它:

function updateProgress() {
      $.ajax({
        url: "/get_progress", 
        method: "get",
        dataType: "script"
      });
}

// Set the function above to run every 2 seconds
var i = setInterval(updateProgress, 2000);

并更新 get_progress.js.erb:

$("#progress").text("<%= @progress.to_s %>");
var checkprogress = <%= @progress.to_i %>;
if (checkprogress == 100) {
   // Stop the function running. Should add clearInterval to error handling of ajax also
   clearInterval(i);
}

编辑

如果提交解压缩操作和检索进度之间存在某种冲突，我建议您使用 remotipart 使解压缩提交异步。 。然后将解压缩的形式更改为:

<% form_tag '/unzip', :html => { :multipart => true }, :remote => true do %>

并添加 create.js.erb文件 <%= remotipart_response do %>根据remotepart自述文件。我仍然建议 get_progress ajax 调用是 get 方法。