我正试图绕过async / await以及如何使用它们。我正在按照我在信中看到的一些例子(我认为),但等待实际上并没有等待ajax响应。这是代码:
async function doAjaxGet(ajaxurl) {
const result = await $.ajax({
url: ajaxurl,
type: 'GET',
datatype: "text",
});
return result;
}
$(document).ready(function () {
let json = doAjaxGet( "/static/imeiXref.json");
console.log('json: ', json);
processJSONData( json );
});
function processJSONData(data) {
console.log('Data: ', data);
Data = JSON.parse( data);
但是await关键字实际上并没有等待返回结果。在控制台日志中,我得到以下内容:
json: Promise {<pending>}
Data: Promise {<pending>} controller.js:98
jQuery.Deferred exception: Unexpected token o in JSON at position 1 SyntaxError: Unexpected token o in JSON at position 1 jquery.min.js:2
at JSON.parse (<anonymous>)
at processJSONData (http://localhost:3000/js/controller.js:99:25)
at HTMLDocument.<anonymous> (http://localhost:3000/js/controller.js:80:5)
at l (http://localhost:3000/js/jquery.min.js:2:29375)
at c (http://localhost:3000/js/jquery.min.js:2:29677) undefined
jquery.min.js:2 Uncaught SyntaxError: Unexpected token o in JSON at position 1
at JSON.parse (<anonymous>)
at processJSONData (controller.js:99)
at HTMLDocument.<anonymous> (controller.js:80)
at l (jquery.min.js:2)
at c (jquery.min.js:2)
但是,如果我实际查看控制台中返回的结果,那么数据实际上就存在了。所以似乎await函数不是'等待',并且我的代码在ajax调用之后继续执行,并且它正在尝试解析尚未返回的JSON数据。我如何等待等待?
感谢.....
答案 0 :(得分:3)
async
函数返回promise。即使从异步函数返回某些内容,它也只会是promise所解析的值。
你需要做这样的事情才能使用诺言:
$(document).ready(function () {
doAjaxGet( "/static/imeiXref.json")
.then(json => {
console.log('json: ', json);
processJSONData( json );
})
});
EDIT。这是一个工作片段。但请注意,这是下载json而不是字符串,因此无需解析它。这与异步问题实际上是一个不同的问题,似乎工作正常。
async function doAjaxGet(ajaxurl) {
const result = await $.ajax({
url: ajaxurl,
type: 'GET',
});
return result;
}
$(document).ready(function() {
doAjaxGet("https://jsonplaceholder.typicode.com/posts/1")
.then(json => {
console.log('json: ', json);
processJSONData(json);
})
});
function processJSONData(data) {
// NOTE: data is already parsed
console.log('Data: ', data);
console.log("id: ", data.userId)
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
答案 1 :(得分:2)
所以这里:
$(document).ready(function () {
let json = doAjaxGet( "/static/imeiXref.json");
console.log('json: ', json);
processJSONData( json );
});
您没有告诉let json
等待来自doAjaxGet
的回复。它在doAjaxGet
函数内部等待,但其他所有内容都是按顺序执行而不等待。
你想做的就是这个(我想):
$(document).ready(async function () {
let json = await doAjaxGet( "/static/imeiXref.json");
console.log('json: ', json);
processJSONData( json );
});
Async / await基本上是承诺的语法糖。 await
等待解决的承诺,因此您必须在使用promise链的每个级别执行异步/等待,或者您可以使用标准的promise.then()
样式编码。