jQuery在后台运行,但不在前台运行

时间:2018-02-18 15:18:11

标签: javascript jquery asynchronous

我有这段代码:

if(!encryption_state){
    if(cKey=="" || cKey==null){
        cKey=getKey(aid); //here we trying to obtain key
        if(cKey!="" && cKey!=null && cKey!=undefined){
            if(isJSON(jKey) && encryption_state){
                var tjKey = JSON.parse(jKey);
                tjKey[aid] = cKey;
                jKey = JSON.stringify(tjKey);
            }else{
                jKey = json.stringify({aid: cKey});
            }
            encryption_state=true;
        }
    }
    if(!encryption_state){
        if(cKey=="" || cKey==null){
            cKey=rndstr(32); //generate string
        }
        var arr = {};
        if(isJSON(jKey)) arr = JSON.parse(jKey);
        arr[aid] = cKey;
        jKey = JSON.stringify(arr);
        encryption_state = true;
    }
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

但是当我打电话给getKey(kaid)函数时:

function getKey(kaid){
    $.ajax({
        method: "POST",
        url: "/?mod=key&fnc=syncKey",
        data: {
            aid: kaid
        },
        done: function(data) {
            var tret = (JSON.parse(data)['msg']);
            return tret;
        }
    });
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

浏览器不继续执行函数getKey(),它们在父函数中执行下一个命令,我不知道为什么它们忽略了Web服务器的答案而且不让函数返回服务器响应:(

2 个答案:

答案 0 :(得分:2)

一般来说,ajax调用是异步的。这意味着,像

这样的序列
 var a = 0;

 a = getAwithAjaxFromServer(...);

 console.log(a);
当ajax仍在运行时,

将立即打印“0”。

cleyencryption_state的整个逻辑必须放入done函数中:

if(!encryption_state){
    if(cKey=="" || cKey==null){
        cKey=getKey(aid);
    }
}

并在你的ajax中:

function getKey(kaid){
    $.ajax({
        method: "POST",
        url: "/?mod=key&fnc=syncKey",
        data: {
            aid: kaid
        },
        done: function(data) {
            var tret = (JSON.parse(data)['msg']);


            .... PUT ALL THE LOGIC HERE .....

        }
    });
}

答案 1 :(得分:2)

你必须了解javascript中的异步机制才能继续调用ajax。有很多资源和stackoverflow问题。例如:https://www.pluralsight.com/guides/front-end-javascript/introduction-to-asynchronous-javascript

因此,您可以转换代码:

if(!encryption_state){
    var serverKeyCallback = function(cKey) {
        if(cKey!="" && cKey!=null && cKey!=undefined){
            if(isJSON(jKey) && encryption_state){
                var tjKey = JSON.parse(jKey);
                tjKey[aid] = cKey;
                jKey = JSON.stringify(tjKey);
            }else{
                jKey = json.stringify({aid: cKey});
            }
            encryption_state=true;
        }
    };
    var localKeyCallback = function(cKey) {
        if(!encryption_state){
            if(cKey=="" || cKey==null){
                cKey=rndstr(32); //generate string
            }
            var arr = {};
            if(isJSON(jKey)) arr = JSON.parse(jKey);
            arr[aid] = cKey;
            jKey = JSON.stringify(arr);
            encryption_state = true;
        }
    }
    manageKey(cKey, aid, serverKeyCallback, localKeyCallback);
}

function manageKey(cKey, kaid, serverKeyCallback, localKeyCallback) {
    if(cKey=="" || cKey==null) {
        $.ajax({
            method: "POST",
            url: "/?mod=key&fnc=syncKey",
            data: {
                aid: kaid
            },
            done: function(data) {
                var tret = (JSON.parse(data)['msg']);
                serverKeyCallback(tret);
                localKeyCallback(tret);
            }
        });     
    }
    else {
        localKeyCallback(cKey);
    }
}

定义两个封装的代码片段,一个在serverResponse之后执行,另一个在serverResponse之后执行或在本地存储cKey时执行。我还没有对代码进行测试,但它必须按照您的预期运行。