Discuter des problèmes liés à readyState et au statut dans Ajax

Cet article présente principalement des informations pertinentes sur les problèmes liés à readyState (valeur de statut) et au statut (code de statut) en Ajax. Il est très bon et a une valeur de référence. Les amis qui en ont besoin peuvent s'y référer

. Examinons d'abord le morceau de code suivant, puis donnons une introduction détaillée aux problèmes liés à readyState (valeur de statut) et au statut (code de statut) dans Ajax. Le contenu spécifique est le suivant :

<.>

var getXmlHttpRequest = function () {
try{
//主流浏览器提供了XMLHttpRequest对象
return new XMLHttpRequest();
}catch(e){
//低版本的IE浏览器没有提供XMLHttpRequest对象，IE6以下
//所以必须使用IE浏览器的特定实现ActiveXObject
return new ActiveXObject("Microsoft.XMLHTTP");
}
};
var xhr = getXmlHttpRequest();
// readyState 0=>初始化 1=>载入 2=>载入完成 3=>解析 4=>完成
// console.log(xhr.readyState); 0
xhr.open("TYPE", "URL", true);
// console.log(xhr.readyState); 1
xhr.send();
// console.log(xhr.readyState); 1
xhr.onreadystatechange = function () {
// console.log(xhr.status); //HTTP状态吗
// console.log(xhr.readyState); 2 3 4
if(xhr.readyState === 4 && xhr.status === 200){
alert(xhr.responseText);
}
};

1.Ajax : La différence entre readyState (valeur de statut) et status (code de statut)

readyState fait référence à l'exécution d'AJAX. Les différents états rencontrés, les étapes qui répondront que l'accès soit réussi ou non, peuvent être compris comme des étapes d'exécution d'AJAX. Utilisez "ajax.readyState" pour obtenir le

<🎜. >
statut, qui indique si l'accès AJAX a réussi ou non, en fonction des informations soumises, le code d'informations d'en-tête HTTP renvoyé par le serveur est utilisé par le protocole HTTP et "ajax.status" est utilisé pour. obtenir

Compréhension globale : On peut simplement comprendre que l'état représente un statut global. Et le statut est le petit statut spécifique sous ce grand État.

2. Qu'est-ce que readyState readyState est un attribut de l'objet XMLHttpRequest, utilisé pour identifier l'état du XMLHttpRequest actuel objet.

readyState a un total de 5 valeurs d'état, allant de 0 à 4. Chaque valeur représente une signification différente

0 : Initialisation, l'objet XMLHttpRequest n'a pas encore été initialisé

1 : Chargement, l'objet XMLHttpRequest commence à envoyer la requête

2 : Le chargement est terminé, la requête de l'objet XMLHttpRequest est terminée

3 : Analyse, l'objet XMLHttpRequest commence pour lire la réponse du serveur

4 : Terminé, l'objet XMLHttpRequest lit la réponse du serveur

3 Qu'est-ce que le statut<. 🎜>status est l'objet XMLHttpRequest Un attribut indiquant le code d'état HTTP de la réponse

Sous le protocole HTTP1.1, les codes d'état HTTP peuvent être divisés en 5 grandes catégories

1xx : Réponse d'information catégorie, indiquant que la demande est reçue et poursuivie Traitement

2xx : Classe de réponse de traitement réussi, indiquant que l'action a été reçue, comprise et acceptée avec succès

3xx : Classe de réponse de redirection, afin de terminer l'action spécifiée, la suite du traitement doit être acceptée

4xx : Erreur du client, la requête du client contient des erreurs de syntaxe ou ne peut pas être exécutée correctement

5xx : Erreur du serveur, le serveur ne peut pas exécuter une requête correcte correctement

100 - Le client doit continuer Faire une requête

101 - Le client demande au serveur de convertir la version du protocole HTTP selon la requête

200 - La transaction est réussi

201 - Invite à connaître l'URL du nouveau fichier

202——Accepté et traité, mais le traitement n'est pas terminé

203——Les informations de retour sont incertain ou incomplet

204——La requête est reçue, mais les informations de retour sont vides

205 - Le serveur a terminé la requête, l'agent utilisateur doit réinitialiser les fichiers actuellement parcourus

206 - Le serveur a terminé certaines des requêtes GET de l'utilisateur

300 - Les ressources demandées sont disponibles à plusieurs endroits

301 - Supprimer les données de la requête

302 - Requête données trouvées à d'autres adresses

303 - Il est conseillé aux clients de visiter d'autres URL ou de visiter la méthode

304 - Le client a effectué GET, mais le fichier n'a pas changé

305 - La ressource demandée doit être obtenue à partir de l'adresse indiquée par le serveur

306 - Avant Code utilisé dans une version de HTTP, n'est plus utilisé dans la version actuelle

307 - Déclarer que la ressource demandée la ressource est temporairement supprimée

400 - Demande d'erreur, telle qu'une erreur de syntaxe

401 - Échec de la demande d'autorisation

402 - Réponse d'en-tête ChargeTo valide conservée

403 - Requête non autorisée

404 - Aucun fichier, requête ou URL trouvé

405 - La méthode définie par l'utilisateur dans le champ Request-Line n'est pas autorisée

406 - D'après le glisser Accepter envoyé par l'utilisateur, la ressource demandée est inaccessible

407 - Semblable à 401 , l'utilisateur doit d'abord être autorisé sur le serveur proxy

408 - Le client n'a pas terminé la demande dans le délai précisé par l'utilisateur

409 - La demande ne peut être complétée pour l'état actuel de la ressource

410 - Cette ressource n'existe plus sur le serveur et n'a plus d'adresse de référence

410 - Cette ressource n'existe plus sur le serveur et n'a plus d'adresse de référence

411 - Le serveur a rejeté la demande d'attribut Content-Length définie par l'utilisateur

412 - Un ou plusieurs champs d'en-tête de demande sont erronés dans la demande actuelle

413 - La ressource demandée est plus grande que la taille autorisée par le serveur

414 - L'URL de la ressource demandée est plus longue que la longueur autorisée par le serveur

415——La ressource demandée ne prend pas en charge le format de l'élément de requête

416——La requête contient le champ d'en-tête de requête Range, il n'y a aucune valeur d'indication de plage dans la plage de ressources de requête actuelle et la requête ne contient pas le champ d'en-tête de requête If-Range

417 - Le serveur ne répond pas aux attentes spécifiées dans le champ d'en-tête Expect de la requête. S'il s'agit d'un serveur proxy, le serveur de niveau inférieur risque de ne pas pouvoir répondre à la requête.

500 - Le serveur a généré un erreur interne

501 - Le serveur ne prend pas en charge la fonction demandée

502 - Le serveur est temporairement indisponible, parfois pour éviter une surcharge du système

503 - Le serveur est surchargé ou suspendu pour maintenance

504 - Surcharge de passerelle, le serveur utilise une autre passerelle ou un autre service pour répondre à l'utilisateur, et le temps d'attente est fixé sur une valeur longue

505 - Le serveur ne prend pas en charge ou refuse de prendre en charge la version HTTP spécifiée dans l'en-tête de la requête

4.思考问题：为什么onreadystatechange的函数实现要同时判断readyState和status呢？

第一种思考方式：只使用readyState

var getXmlHttpRequest = function () {
if (window.XMLHttpRequest) {
return new XMLHttpRequest();
}
else if (window.ActiveXObject) {
return new ActiveXObject("Microsoft.XMLHTTP");
}
};
var xhr = getXmlHttpRequest();
xhr.open("get", "1.txt", true);
xhr.send();
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
alert(xhr.responseText);
}
};

服务响应出错了，但还是返回了信息，这并不是我们想要的结果

如果返回不是200，而是404或者500，由于只使用readystate做判断，它不理会放回的结果是200、404还是500，只要响应成功返回了，就执行接下来的javascript代码，结果将造成各种不可预料的错误。所以只使用readyState判断是行不通的。

第二种思考方式：只使用status判断

var getXmlHttpRequest = function () {
try{
return new XMLHttpRequest();
}catch(e){
return new ActiveXObject("Microsoft.XMLHTTP");
}
};
var xhr = getXmlHttpRequest();
xhr.open("get", "1.txt", true);
xhr.send();
xhr.onreadystatechange = function () {
if (xhr.status === 200) {
alert("readyState=" + xhr.readyState + xhr.responseText);
}
};

事实上，结果却不像预期那样。响应码确实是返回了200，但是总共弹出了3次窗口！第一次是“readyState=2”的窗口，第二次是“readyState=3”的窗口，第三次是“readyState=4”的窗口。由此，可见onreadystatechange函数的执行不是只在readyState变为4的时候触发的，而是readyState（2、3、4）的每次变化都会触发，所以就出现了前面说的那种情况。可见，单独使用status判断也是行不通的。

5.由上面的试验，我们可以知道判断的时候readyState和status缺一不可。那么readyState和status的先后判断顺序会不会有影响呢？我们可以将status调到前面先判断，代码如 xhr.status === 200 && xhr.readyState === 4

事实上，这对于最终的结果是没有影响的，但是中间的性能就不同了。由试验我们知道，readyState的每次变化都会触发onreadystatechange函数，假如先判断status，那么每次都会多判断一次status的状态。虽然性能上影响甚微，不过还是应该抱着追求极致代码的想法，把readyState的判断放在前面。

xhr.readyState === 4 && xhr.status === 200

上面是我整理给大家的，希望今后会对大家有帮助。

相关文章：

全面解析$.Ajax()方法参数（图文教程）

IE8下Ajax缓存问题及解决办法

浅谈ajax请求技术

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!