Quelle est la différence entre axios et ajax

La différence entre axios et ajax : 1. axios est une bibliothèque HTTP basée sur Promise, tandis que ajax est une encapsulation de XHR natif ; 2. la technologie ajax réalise l'actualisation des données locales, tandis qu'axios réalise l'encapsulation d'ajax.

L'environnement d'exploitation de cet article : système Windows 7, ECMAScript version 6, ordinateur Dell G3.

Quelle est la différence entre ajax et ajax ?

La différence, avantages et inconvénients entre axios et ajax :

ajax :

1.

Ajax est une encapsulation XHR native, afin d'atteindre notre objectif de saute-mouton, ajoute la prise en charge de JSONP.

　

Javascript et XML asynchrones, ajax n'est pas une nouvelle technologie, mais une combinaison de plusieurs technologies, utilisée pour créer rapidement des pages dynamiques, et peut mettre à jour les données sans les actualiser pour améliorer l'expérience utilisateur.

2. Quel est le principe d'ajax ?

　Le client demande au moteur ajax, puis le moteur ajax demande au serveur. Le serveur fait une série de réponses et renvoie au moteur ajax. Le moteur ajax décide où écrire le résultat au client. Réalisez la mise à jour des données sans actualisation de la page.

3. Objet de base ?

　XMLHttpReques

4. Quels sont les avantages et les inconvénients d'ajax ?

Avantages

1. Mettre à jour les données sans actualiser

2. Communication asynchrone avec le serveur

3. Équilibrage de charge front-end et back-end

4. Largement pris en charge sur la base des standards

5. Séparation de l'interface et application

Inconvénients ：

　 1. Ajax ne peut pas utiliser les fonctions Retour et Historique, ce qui endommage le mécanisme du navigateur.

　　2. Problèmes de sécurité Ajax expose les détails de l'interaction avec le serveur

　　3. La prise en charge des moteurs de recherche est relativement faible

　　4. Détruire le mécanisme de gestion des exceptions du programme

　　5. Violer l'intention originale de l'URL et positionnement des ressources

　　6, Ajax ne prend pas bien en charge les appareils mobiles

　　7. Trop de code client entraîne des coûts de développement

5. Scénarios applicables Ajax

　　<1>. Navigation dans l'arborescence 　　<3>. Réponse de communication rapide d'utilisateur à utilisateur　　　　4>. Scénarios insignifiants tels que le vote, oui/non, etc.
　　　<5>. ;. Invites de saisie de texte ordinaires et scénarios de saisie semi-automatique

6. Scénarios non applicables à Ajax

　　<1>. Quelques formulaires simples
　　<2> Recherche
　　<3>. ;. Remplacez une grande quantité de texte　　<5>. Manipulez la présentation

7, code

$.ajax({
  type: 'POST',
  url: url,
  data: data,
  dataType: dataType,
  success: function () {},
  error: function () {}
});

8, cinq étapes de la requête ajax

　 1. Créez un objet asynchrone XMLHttpRequest

　 2. Définissez la fonction de rappel. 3. Utilisez la méthode open pour établir une connexion avec le serveur

4. Envoyez des données au serveur

5. Traitez différents statuts de réponse dans la fonction de rappel

axios :

1. 'est-ce qu'axios ? Axios est une bibliothèque HTTP basée sur Promise

, qui peut être utilisée dans les navigateurs et node.js.

2. Quelles sont les fonctionnalités d'axios ? 　　1. Créez des requêtes XMLHttpRequests dans le navigateur

　　2. Créez des requêtes http dans node.js

　　3. Prise en charge de l'API Promise　4. Prise en charge de l'interception des requêtes et des réponses
　5. Convertir les requêtes et données de réponse

　6. Annuler la demande

　7. Convertir automatiquement au format de données JSON

　8. Le client prend en charge la défense contre XSRF

3. Il existe deux façons d'exécuter la demande get

// 第一种方式  将参数直接写在url中axios.get('/getMainInfo?id=123')
.then((res) => {
  console.log(res)
})
.catch((err) => {
  console.log(err)
})// 第二种方式  将参数直接写在params中axios.get('/getMainInfo', {  params: {
    id: 123
  }
})
.then((res) => {
  console.log(res)
})
.catch((err) => {
  console.log(err)
})

4. Exécutez la demande de publication, veuillez faire attention aux paramètres d'entrée de la demande de publication, qui n'ont pas besoin d'être écrits dans le champ params. Cet endroit doit être distingué de la deuxième méthode de la demande d'obtention.

axios.post('/getMainInfo', {
  id: 123})
.then((res) => {
  console.log(res)
})
.catch((err) => {
  console.log(err)
})

La différence entre ajax et ajax :

axios est une encapsulation de la technologie ajax via Promise, tout comme l'encapsulation d'ajax par jquery. En termes simples, la technologie ajax réalise le rafraîchissement des données locales, axios implémente l'encapsulation. d'ajax. Certains axios ont ajax, mais certains ajax n'ont pas nécessairement axios. Pour résumer, axios est ajax, et ajax est plus qu'axios.

Remarque : Ajax traditionnel fait référence à XMLHttpRequest (XHR),

　axios et jQuer ajax sont tous deux une encapsulation d'Ajax

Apprentissage recommandé : "tutoriel vidéo 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!