rails ajax post工作不一致

时间:2012-10-13 11:51:33

标签: jquery ruby-on-rails ajax ruby-on-rails-3

好的,这个让我发疯了。首先,在我的开发环境中一切正常。但是,在生产中,多个浏览器的行为不一致。有时候它有效,有时则不然。我正在使用Rails 3.1和jQuery 1.8.2。我一直在使用jQuery 1.4.1,它当时也没用。

以下是应该发生的事情:用户单击“保存”按钮,客户端将JSON格式的数据发送到rails,后者使用它创建几个新的“响应”项,然后将用户重定向到控制器“show”操作(用户应答轮询,然后查看所有用户的结果)。

以下是我的观点(answer.html)中的相关代码:

$.ajaxSetup({
    'beforeSend': function(xhr) {
        xhr.setRequestHeader("Accept", "text/javascript")
    }
});

$(document).ajaxSend(function(e, xhr, options) {
  var token = $("meta[name='csrf-token']").attr("content");
  xhr.setRequestHeader("X-CSRF-Token", token);
});

var plot;
var dataseries = [[[null,null]],[[null,null]],[[null,null]],[[null,null]],[[null,null]],[[null,null]],[[null,null]],[[null,null]],[[null,null]]];

$(document).ready(function(){
$('.save_button').click(function(event){
    event.preventDefault();
    var numItems = dataseries.length;
    var item;
    var sequence;
    var question = <%=@question.id%>;

    var dataArray = new Array();

    for (i=0;i<numItems;i++){
        var requestObj = {
          question_id: "<%=@question.id%>",
          user_id: "<%= @user %>",      
    }
        item = $('.item_list li[data-seq='+i+']').attr('id');
        requestObj["item_id"] = item;
        requestObj["x"]= dataseries[i][0][0];
        requestObj["y"]= dataseries[i][0][1];

    if (requestObj["item_id"]>0 && requestObj["x"]!=null && requestObj["y"]!=null ){
        dataArray.push(requestObj);
    }


    }
    var dataString = JSON.stringify(dataArray);
    var a = $.ajax({
    url: "/responses/batchCreate",
    data: dataString,
    type: "POST",
    dataType: 'json',
    success: function(data, textStatus, jqXHR) {
    },
    error: function(jqXHR, textStatus, errorThrown) {
      alert('error:');
    },
    headers: {
      'X-CSRF-Token': '<%= form_authenticity_token.to_s %>'
    }
    })


    window.location.replace("<%=question_path(@question)%>");
});

$('。save_button')。click(函数(事件)每次都会触发。“错误”回调每次都会触发 - 但有时它会起作用!

以下是相关的控制器代码:

def batchCreate
        logger.info "RECEIVED AJAX DATA!!!!"
        responses = ActiveSupport::JSON.decode(request.body.read)
        responses.each do |resp|
          if (resp["item_id"]!=:null && resp["x"]!=:null && resp["y"]!=:null )
            @response = Response.new()
            if resp["user_id"]!=""
              @response.user_id=resp["user_id"];
            else
              u = User.where(:token => cookies[:user]).first
              if u.nil?
                u = User.create!(:email => "guest_#{Time.now.to_i}#{rand(99)}@example.com", :password => cookies[:user], :token => cookies[:user])
                @response.user_id=u.id
              else
                @response.user_id = u.id
              end
            end

            @response.question_id=resp["question_id"].to_i
            @response.item_id = resp["item_id"].to_i
            @response.x = resp["x"].to_i
            @response.y = resp["y"].to_i
            @response.save
          end
        end

    respond_to do |format|

        format.html { redirect_to @response, :notice => 'Question was successfully created.' }
        format.json { render :json => response, :status => :created, :location => @response }
        format.js 

    end

  end

有时会保存数据,在我的数据库中创建新的响应,并且页面会重定向到show动作。其他时候,它只是重新加载页面。在这些情况下,post数据似乎没有到达服务器 - 我在production.log中看不到任何内容。

我是ajax的完全初学者,只是在Rails上稍微胜任。您可以提供有关如何开始解决此问题的任何见解将非常感激。谢谢。

2 个答案:

答案 0 :(得分:0)

点击处理程序末尾的这一行将在每次点击时重新加载页面:

 window.location.replace("<%=question_path(@question)%>");

由于此重定向,AJAX请求可能会或可能不会完成,具体取决于执行的时间。我认为这是导致结果不一致的原因。也许开发环境中的执行时间使您不会在本地遇到问题。

我认为您可能希望在成功响应处理程序中移动该行代码,以便仅在AJAX请求成功时才会发生重定向

success: function(data, textStatus, jqXHR) {
  window.location.replace("<%=question_path(@question)%>");
}

我会避免使用嵌入式Ruby代码生成JavaScript并将所有JavaScript代码移出视图并转移到资产文件中。可以将所需的URL设置为保存按钮的href属性,而不是使用<%=question_path(@question)%>内联。

# View
<%= link_to "Save", question_path(@question), :class => "save_button" %>

# JavaScript
...
success: function(data, textStatus, jqXHR) {
  window.location.replace(e.target.href);
}
...

或者,您可以使用数据属性来存储URL而不是href属性。

答案 1 :(得分:0)

好吧,事实证明window.location.replace(“&lt;%= question_path(@question)%&gt;”)部分是罪魁祸首。当我早些时候回答时,我以为我已经移动了它,但显然,我没有。然而,仅凭这一点还不够;我也缺少batchCreate.js.erb,我的行动的模板文件。这导致500错误,这是在ajax调用上创建错误条件的原因。它似乎现在正在运作。非常感谢Ogz向导的帮助!