使用getJSON时,如何获取响应数据?

Posted

技术标签:

【中文标题】使用getJSON时,如何获取响应数据?【英文标题】:When using getJSON, how to capture the response data? 【发布时间】:2012-07-07 23:21:40 【问题描述】:

发生了一些奇怪的事情......我有他的以下功能:

getInviteLink : function() 
    var me = this,
        invite_url;

    $.getJSON('get_invite_code.json', function(data) 
        console.log(data.invite_url);
        invite_url = data.invite_url;
    );

    console.log(invite_url)

    return invite_url;
,

当它运行时,第一个控制台日志返回正确的值。但是,在第二个控制台日志上什么都没有。为什么不能从 getJSON 函数内部设置invite_url?

谢谢

【问题讨论】:

【参考方案1】:

因为 getJSON 方法是异步的。发生了什么事...

getInviteLink : function()   // this function is called...
    var me = this,   
    invite_url;               // happens right away

    $.getJSON('get_invite_code.json', function(data) 
        // Step 2, these statements don't happen until later 
        // -- when the response is received
        console.log(data.invite_url);  // this
        invite_url = data.invite_url;
    );  //  Step 1. the getJSON is called right away

    console.log(invite_url) // this happens right after the
                            // the getJSON is called, but before
                            // it gets a response. Thus no data when the log
                            // statement is invoked

    return invite_url;      // also no data (yet) when this return statement
                            // is executed
,

已添加要修复您的软件,您需要意识到在收到来自服务器的 JSON 响应之前,您无法对 invite_url 执行任何操作。 -- 如果您的客户端出现网络问题或服务器问题,则可能永远不会收到。

您可以将一个函数传递给您的 getJSON 调用。该函数将使用invite_url。同时,您可以为您的客户做其他事情。

如果在您收到响应之前您的软件无事可做,则设置忙碌指示符(旋转圆圈或其他东西),然后启动 json 请求并让函数在您收到响应时取消忙碌指示符.

有关更多信息,请参阅 jQuery json 文档。

【讨论】:

非常有帮助,谢谢,关于如何使它工作的任何建议?【参考方案2】:

您无法在 about 代码中使用 getJSON 作为返回值。如果要使用inviteURL,则需要使用回调函数进行重构。

在这种情况下,如果您看到控制台的顺序。它会先执行invite_url,然后执行data.invite_url。 getJSON 的原因是异步调用。要使其正常工作,您需要调用 get JSON with async: false with 是不可能的,您需要将 $.ajax 与 datatyoe json 一起使用。以下示例将符合您的需要。

getInviteLink: function() 
    var me = this,
        invite_url;

    $.ajax(
        url: 'get_invite_code.json',
        dataType: 'json',
        async: false,
        success: function(data) 
            console.log(data.invite_url);
            invite_url = data.invite_url;
        
    );

    console.log(invite_url)

    return invite_url;
,

如果 return 在这里不是强制性的,我建议重构代码并使用回调函数而不是 async false。所以你可以使用 getJSON

【讨论】:

【参考方案3】:

它确实设置了它,但是是异步的。只有在服务器响应到达时才会调用回调函数。不过,$.getJSON 函数将在请求发送后立即返回,因此“第二个”console.log 实际上会首先发生,在回调函数被调用之前。

您不能编写这样的函数来同步返回异步服务器请求的结果。

【讨论】:

建议修改?在成功内插入返回? 抱歉,您无法返回该值。您不能创建从异步请求返回值的同步函数。你能做的最好的就是使用成功回调中的值。

以上是关于使用getJSON时,如何获取响应数据?的主要内容,如果未能解决你的问题,请参考以下文章

如何使用 Firebase 获取通知响应数据?

数据发布到 URL 时如何获取响应

如何在使用 Reflux 的商店中使用 AJAX 获取初始状态

使用 zoho 图像获取 api 时,如何在 react native 中解决图像数据响应为 null 的问题?

使用 .getJSON 获取 Play 商店应用详细信息时出现跨域阻止请求 [CORS] 错误

$.getJSON 获取状态