Démarrage rapide JavaScript : obtention des codes d'état HTTP

Démarrage rapide : Utilisation de JavaScript pour obtenir des codes d'état HTTP, exemples de codes spécifiques requis

Introduction :
Lors du développement d'applications Web, nous devons souvent interagir avec le serveur et obtenir des codes d'état HTTP. Les codes d'état HTTP sont des nombres à trois chiffres renvoyés par le serveur en réponse à une requête. Ils fournissent des diagnostics de base et des informations sur l'état de la requête. Dans cet article, nous apprendrons comment obtenir des codes d'état HTTP à l'aide de JavaScript et fournirons quelques exemples de codes concrets.

1. Envoyer une requête HTTP à l'aide de l'objet XMLHttpRequest
   Pour obtenir le code d'état HTTP, nous devons d'abord envoyer une requête HTTP à l'aide de l'objet XMLHttpRequest (XHR). Les objets XHR nous permettent de communiquer de manière asynchrone avec le serveur et d'obtenir des données de réponse en arrière-plan.

Ce qui suit est un exemple de code d'utilisation d'un objet XHR pour envoyer une requête GET :

let xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET", "http://example.com/api/data", true);
xmlhttp.send();

2. Écoutez les changements d'état de l'objet XHR
   Lorsque l'objet XHR envoie une requête et reçoit une réponse du serveur, son état prêt changements de propriété. Nous pouvons obtenir le code d'état HTTP en écoutant les modifications apportées à cet attribut.

Ce qui suit est un exemple de code d'utilisation de l'événement onreadystatechange pour surveiller les changements d'état d'un objet XHR :

xmlhttp.onreadystatechange = function() {
    if (this.readyState === 4) {
        console.log(this.status); // 输出HTTP状态码
    }
};

3. Obtenir le code d'état HTTP
   Une fois que la valeur de l'attribut readyState de l'objet XHR est 4, nous pouvons obtenir le code d'état HTTP via l'attribut status. Les codes d'état HTTP sont généralement renvoyés sous forme de chiffres, tels que 200 pour « OK », 404 pour « Not Found », 500 pour « Internal Server Error », etc.

Ce qui suit est un exemple de code pour obtenir le code d'état HTTP :

xmlhttp.onreadystatechange = function() {
    if (this.readyState === 4) {
        console.log(this.status); // 输出HTTP状态码
    }
};

4. Traitement de différents codes d'état HTTP
   Selon différents codes d'état HTTP, nous pouvons créer différentes logiques de traitement. Voici quelques codes d'état HTTP courants et les méthodes de traitement correspondantes :

• 200 : La demande est réussie et vous pouvez continuer à traiter les données renvoyées par le serveur.
• 404 : La ressource demandée n'existe pas. Vous pouvez afficher une page d'erreur ou demander à l'utilisateur de saisir à nouveau.
• 500 : Erreur interne du serveur, vous pouvez afficher une page d'erreur ou signaler le problème au serveur.

Voici un exemple de code pour un traitement basé sur différents codes d'état HTTP :

xmlhttp.onreadystatechange = function() {
    if (this.readyState === 4) {
        if (this.status === 200) {
            // 请求成功
            console.log("请求成功");
            console.log(this.responseText); // 输出服务器返回的数据
        } else if (this.status === 404) {
            // 请求的资源不存在
            console.log("请求的资源不存在");
        } else if (this.status === 500) {
            // 服务器内部错误
            console.log("服务器内部错误");
        }
    }
};

Conclusion :
Dans cet article, nous avons appris comment obtenir des codes d'état HTTP à l'aide de JavaScript. Nous utilisons l'objet XMLHttpRequest pour envoyer une requête HTTP et obtenir le code d'état en surveillant ses changements d'état. Selon différents codes de statut, nous pouvons créer différentes logiques de traitement. Ces exemples de code peuvent nous aider à mieux comprendre et utiliser JavaScript pour gérer les codes d'état HTTP.

Bien que l'obtention du code d'état HTTP soit une tâche simple, elle est très importante pour le débogage et la gestion des réponses du serveur. En comprenant et en utilisant les codes d'état HTTP, nous pouvons mieux gérer les problèmes dans les applications Web et offrir une meilleure expérience utilisateur.

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!