Here are the functions I have.
async function check_saved_url() {
$.get("https://ipinfo.io/json", function (response) {
current_ip = response.ip;
location_here = response.country;
var ajax_get_url_prefix = base_url 'getDomain.php?ip=';
var key_ip = current_ip '@@@' domain_permanent;
var url = ajax_get_url_prefix key_ip;
$.get(url, function(data, status) {
console.log("Data: " data "\nStatus: " status);
if (data.includes('0 results')) {
return 'unknown';
} else {
return data;
}
});
}, "jsonp");
}
const func1 = async() => {
return await check_saved_url();
}
const func2 = async() => {
let domain_preference = '';
domain_preference = await func1();
console.log("domain_preference: ",domain_preference);
}
func2();
The top red line is the output of func2
, which must wait until check_saved_url
runs, whose result is the following 2 circles.
I am not sure why this persists to happen and hours of copying answers from everywhere didn't help me.
CodePudding user response:
Your function check_saved_url
does not return a promise - this is why await
is not working for it.
The solution would be to return a promise in check_saved_url
.
Suppose I have a function create_promise
which I want to await (this mimics your 'get' request):
function create_promise() {
return new Promise(resolve => {
setTimeout(() => resolve("Done!"), 500);
});
}
const func1 = async() => {
const result = await create_promise();
return result " <- result";
};
func1().then(console.log);
CodePudding user response:
You need to return a Promise
from check_saved_url
. Inside of the Promise, you then need to use resolve
to replace return
. You can also use reject(new Error("error"))
if there was an error.
async function check_saved_url() {
return new Promise((resolve, reject) => {
$.get("https://ipinfo.io/json", function (response) {
current_ip = response.ip;
location_here = response.country;
var ajax_get_url_prefix = base_url 'getDomain.php?ip=';
var key_ip = current_ip '@@@' domain_permanent;
var url = ajax_get_url_prefix key_ip;
$.get(url, function(data, status) {
console.log("Data: " data "\nStatus: " status);
if (data.includes('0 results')) {
// Instead of return, use resolve()
//return 'unknown';
resolve('unknown');
// You can also pass an error with `reject(new Error("error"))`
} else {
// Instead of return, use resolve()
//return data;
resolve(data);
}
});
}, "jsonp");
});
}
const func1 = async() => {
return await check_saved_url();
}
const func2 = async() => {
let domain_preference = '';
domain_preference = await func1();
console.log("domain_preference: ",domain_preference);
}
func2();
You can read more about promises on MDN
CodePudding user response:
I will suggest you to use fetch API check_saved_url(). It return promise. You can read more about it here. https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
Code will go like this :
async function check_saved_url() {
let connect = await fetch("https://ipinfo.io/json")
let response = await connect.json()
current_ip = response.ip;
location_here = response.country;
var ajax_get_url_prefix = base_url 'getDomain.php?ip=';
var key_ip = current_ip '@@@' domain_permanent;
var url = ajax_get_url_prefix key_ip;
// $.get(url, function(data, status) {
// console.log("Data: " data "\nStatus: " status);
// if (data.includes('0 results')) {
// return 'unknown';
// } else {
// return data;
// }
// });
// }, "jsonp");
}
CodePudding user response:
There is no promise returned by check_saved_url
nor is $.get returning a promise. You need to wrap it all in a promise
async function check_saved_url() {
return new Promise((resolve, reject) => {
$.get("https://ipinfo.io/json", function (response) {
current_ip = response.ip;
location_here = response.country;
var ajax_get_url_prefix = base_url 'getDomain.php?ip=';
var key_ip = current_ip '@@@' domain_permanent;
var url = ajax_get_url_prefix key_ip;
$.get(url, function(data, status) {
console.log("Data: " data "\nStatus: " status);
if (data.includes('0 results')) {
resolve('unknown');
} else {
resolve(data);
}
})
.fail(reject);
}, "jsonp")
.fail(reject);
})
}
Clean the code
To have a cleaner and reusable code you can wrap $.get
in a Promise
async function async_get(url) {
return new Promise((resolve, reject) => {
const jqxhr = $.get(url);
jqxhr.done(() => resolve({ json: jqxhr.responseJSON, status: jqxhr.status }));
jqxhr.fail(() => reject(jqxhr));
})
}
async function check_saved_url() {
const { json: response } = await async_get("https://ipinfo.io/json");
current_ip = response.ip;
location_here = response.country;
var ajax_get_url_prefix = base_url 'getDomain.php?ip=';
var key_ip = current_ip '@@@' domain_permanent;
var url = ajax_get_url_prefix key_ip;
const { json: data, status } = await $.get(url);
console.log("Data: " data "\nStatus: " status);
return data.includes('0 results') ? 'unknown' : data;
}