JavaScript在从服务器获取数据之前正在处理

时间:2016-03-23 04:30:58

标签: javascript jquery ruby-on-rails json ajax

条纹需要在服务器端而不是客户端验证优惠券,所以我写了一些代码来做到这一点,但我在同步AJAX / JSON方面遇到了一些麻烦响应。

在我的控制器中,我有一个名为validate_coupon的方法,它接受优惠券代码并验证它是否存在于Stripe系统中以及是否有效。然后该函数返回true或false作为JSON。

def validate_coupon
    code = params[:code]
    begin
        coupon = Stripe::Coupon.retrieve(code)
    rescue => e
        coupon = nil
    end
    valid = coupon.nil? ? false : coupon.valid
    respond_to do |format|
        format.json { render :json => valid }
    end
end

我已经在这个函数中放置了验证优惠券的JavaScript。它似乎工作,返回200 okay状态,并且console.log在此处根据优惠券的有效性正确显示true或false。但是,200状态和控制台上的日志消息之间存在明显的延迟。

function validateCoupon() {
    requestData = "";
    $.ajax({
        type: "GET",
        url: "business/validate_coupon/"+$('#coupon_code').val(),
        dataType: "json",
        data: requestData,
        success: function(response) {
            console.log(response);
            return response;
        }
    });
}

此功能稍后使用:

...
valid = validateCoupon();
console.log("validateCoupon returned " + valid);
if (valid) {
...

当我查看控制台中的日志消息时,这就是我所看到的:

status = 200
validateCoupon returned undefined
true

表示我在从服务器返回之前处理返回的数据。我预计JSON会在状态的同时返回。有没有办法让JavaScript等待JSON?

2 个答案:

答案 0 :(得分:1)

AJAX所做的只是进行ajax调用并将其置于堆栈中,因为它具有异步行为并继续前进。

之后当任何json响应再次出现时,再去成功函数并让你的代码执行成功函数。

这是你的情况下发生的事情,首先它执行然后继续并显示返回为未定义,然后转到成功函数并显示为真。

你可以做的是你可以在获得回复后调用成功函数中的函数。

function validateCoupon() {
requestData = "";
$.ajax({
    type: "GET",
    url: "business/validate_coupon/"+$('#coupon_code').val(),
    dataType: "json",
    data: requestData,
    success: function(response) {
        console.log(response);
        return response;
        xyz();
    }
  });
}

function xyz(){
 ......
 ......
 }

答案 1 :(得分:1)

return response;是传递给success:而不是validateCoupon的函数的返回值 - validateCoupon函数在这种情况下没有返回值。

为了实现你的目标,你可以做@jzaa建议的事情 - 通过一个小编辑:

function validateCoupon() {
    requestData = "";
    $.ajax({
        type: "GET",
        url: "business/validate_coupon/"+$('#coupon_code').val(),
        dataType: "json",
        data: requestData,
        success: function(response) {
            console.log(response);
            doStuff(response);
        }
    });
}

function doStuff(response) {
    console.log("validateCoupon returned " + response);
}