Comment puis-je utiliser async GM_xmlhttpRequest pour renvoyer les valeurs dans l'ordre d'origine ?
J'essaie de créer un script Tampermonkey pour mettre à jour les dates sur certains sites. J'ai obtenu un tableau d'identifiants d'un site et j'en demande des données avec l'identifiant du tableau. Après cela, je dois retourner les données de chaque entrée.
Comme la fonction est async
, elle renvoie les données dans un ordre aléatoire, mais j'ai besoin que ces nouveaux tableaux reviennent dans l'ordre d'origine. J'ai essayé sync and Promise
s, mais le premier est trop lent et je n'ai pas compris le second.
Je peux trier les identifiants, mais j'ai également obtenu les dates qui sont dans l'ordre du premier tableau, donc je ne sais pas comment obtenir le même ordre que le deuxième tableau d'identifiants.
Voici le code :
id = GM_getValue('id');
for (let i = 0; i < id.length; i++) {
setTimeout(() => {
console.log("Updating " + (i + 1) + " Title");
GM_xmlhttpRequest({
method: "GET",
url: "***" + id[i] + "/***",
onload: function(response) {
$(response.responseText).find("#main-form :input").each(function(x) { if (x == 0) ids.push(parseInt($(this).val()));
if (x == 1) array.push($(this).val()));
});
}
});
}, i * 333);
}
Réponses
Vous pouvez utiliser Promises pour exécuter les GET
demandes dans un ordre spécifique. Voici un exemple :
id = GM_getValue('id');
function makeGetRequest(url) {
return new Promise((resolve, reject) => {
GM_xmlhttpRequest({
method: "GET",
url: url,
onload: function(response) {
resolve(response.responseText);
},
onerror: function(error) {
reject(error);
}
});
});
}
for (let i = 0; i < id.length; i++) {
console.log("Updating " + (i + 1) + " Title");
try {
const response = await makeGetRequest("***" + id[i] + "/***");
$(response).find("#main-form :input").each(function(x) { if (x == 0) ids.push(parseInt($(this).val()));
if (x == 1) array.push($(this).val());
});
} catch (error) { // in case the GET request fails
console.error("Request failed with error code", error.status, ". Message is ", error.responseText);
}
}
Dans cet exemple, j'ai créé une makeGetRequest()
fonction avec renvoie une promesse, qui est résolue en cas de succès GET, mais rejetée en cas d'échec.
await
attend que la promesse soit réglée avant de continuer et try
existe pour attraper le rejet de la promesse (si le GET échoue).
Les références:
- Promisesur MDN .
- awaitsur MDN .