Comment résoudre le code d'état Vue Forwarding 200

Vue est un framework de développement front-end populaire. Avec la tendance à la séparation du front-end et du back-end, de plus en plus de développeurs choisissent d'utiliser Vue pour créer des applications front-end. La transmission du code d'état 200 est un problème souvent rencontré. Développement de vues. Ci-dessous, examinons de plus près ce problème.

Tout d'abord, il doit être clair que lorsque Vue envoie une requête au backend, le serveur renvoie un code d'état HTTP pour informer Vue du résultat du traitement de la requête. Le code d'état HTTP est un indicateur d'état dans le protocole HTTP, qui indique au client si le résultat de la demande est un succès, un échec, une redirection, etc.

Dans Vue, les méthodes de requête courantes incluent GET, POST, PUT, DELETE, etc. Les codes d'état de requête de ces méthodes sont différents : 200, 201, 204, 400, 401, 404, 500, etc. Parmi eux, le code d'état 200 indique que le serveur a traité avec succès la demande. Transférer le code d'état 200 signifie que, pour certaines raisons, nous devons forcer le code d'état renvoyé par le backend à 200.

Pourquoi devons-nous transmettre le code de statut 200 ? Dans le développement réel d'un projet, nous pouvons rencontrer le problème des requêtes inter-domaines. Lors des requêtes inter-domaines, le navigateur lance généralement une requête de contrôle en amont OPTIONS pour déterminer quelles méthodes HTTP, informations d'en-tête, etc. peuvent être utilisées.

Si le backend ne traite pas la requête OPTIONS et renvoie directement un code d'état autre que 200, le navigateur l'interceptera et refusera les requêtes inter-domaines. Dans ce cas, nous devons modifier le code d'état renvoyé par le backend en 200 pour contourner l'interception du navigateur.

Comment transférer le code de statut 200 dans Vue ? Vue fournit une méthode pour modifier le code d'état renvoyé par le backend à 200 via l'intercepteur axios.

Plus précisément, nous pouvons ajouter un intercepteur dans axios pour traiter le résultat du retour avant de renvoyer les données, et forcer le code d'état renvoyé par le backend à 200. Le code est le suivant :

import axios from 'axios';

axios.interceptors.response.use(response => {
  if (response.config.url !== '/login' && response.status !== 200) {
    response.status = 200;
  }
  return response;
}, error => {
  return Promise.reject(error);
});

Dans ce code, nous ajoutons un intercepteur via la méthode axios.interceptors.response.use pour traiter les données renvoyées par le backend. Tout d'abord, déterminez si l'URL actuellement demandée est une demande de connexion. Dans le cas contraire, le code d'état est modifié de force en 200 et le résultat traité est renvoyé.

La dernière chose à noter est que la transmission du code d'état 200 n'est qu'une solution. Si le backend peut gérer la demande OPTIONS et renvoyer correctement le code d'état, alors il n'est pas nécessaire de transmettre le code d'état.

Dans le développement de projets, nous devons choisir une solution qui nous convient en fonction de la situation réelle pour éviter des problèmes inutiles. Le transfert du code d'état 200 via l'intercepteur Vue peut résoudre le problème inter-domaines du navigateur, mais il doit être utilisé avec prudence dans le projet pour éviter des conséquences néfastes.

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!