1.jQuery ajax
Традиционный Ajax относится к XMLHttpRequest(XHR) — самой ранней технологии бэкенд-запросов, появившейся в оригинальном js, а ядро использует объект XMLHttpRequest.
JQuery Ajax — это инкапсуляция нативного XHR и добавляет поддержку JSONP. После многих лет обновления и обслуживания он действительно очень удобен, и преимущества не нужно перечислять; Если вы настаиваете на перечислении нескольких недостатков, это может быть только:
1. Это программирование для MVC, которое не соответствует текущей волне фронтенд-MVVM
2. На основе нативной разработки XHR архитектура XHR остаётся неясной.
3. Весь проект JQuery слишком большой, и крайне неразумно внедрять весь JQuery только с помощью ajax (используя персонализированное решение для упаковки и не пользуясь CDN-сервисами)
4. Он не соответствует принципу разделения интересов
5. Конфигурация и вызов очень запутанны, а асинхронная модель на основе событий не является дружелюбной.
PS:MVVM(Model-View-ViewModel), 源自于经典的 Model–View–Controller（MVC）模式。MVVM 的出现促进了 GUI 前端开发与后端业务逻辑的分离，极大地提高了前端开发效率。MVVM 的核心是 ViewModel 层，它就像是一个中转站（value converter），负责转换 Model 中的数据对象来让数据变得更容易管理和使用，该层向上与视图层进行双向数据绑定，向下与 Model 层通过接口请求进行数据交互，起呈上启下作用。View 层展现的不是 Model 层的数据，而是 ViewModel 的数据，由 ViewModel 负责与 Model 层交互，这就完全解耦了 View 层和 Model 层，这个解耦是至关重要的，它是前后端分离方案实施的最重要一环。
Как показано на следующем рисунке:
2.axios
После Vue2.0 Ю Юси рекомендовал заменить JQuery Ajax на axios, что, должно быть, заставило axios попасть в глаза многих людей.
axios — это HTTP-клиент, основанный на обещаниях для браузеров и nodejs, который по сути представляет собой инкапсуляцию нативного XHR, за исключением того, что это реализация обещаний, соответствующая последним спецификациям ES, и сама она обладает следующими характеристиками:
1. Создайте XMLHttpRequest из вашего браузера.
2. Поддержка Promise API
3. Клиентская поддержка препятствует CSRF
4. Предоставить некоторые интерфейсы для параллельных запросов (что важно, гораздо удобнее для работы)
5. Создайте HTTP-запрос из node.js
6. Запросы на перехват и ответы
7. Преобразование данных запросов и ответов
8. Отмена запроса
9. Автоматическое преобразование данных JSON
PS:防止CSRF:就是让你的每个请求都带一个从cookie中拿到的key, 根据浏览器同源策略，假冒的网站是拿不到你cookie中得key的，这样，后台就可以轻松辨别出这个请求是否是用户在假冒网站上的误导输入，从而采取正确的策略。
3. Принести
Fetch позиционируется как альтернатива AJAX, который появился в ES6 и использует объект promise в ES6. Fetch создаётся на основе обещаний. Структура кода Fetch гораздо проще, чем в ajax, а параметры немного напоминают jQuery ajax. Однако обязательно запомнитеfetch не является дополнительной инкапсуляцией ajax, а является нативным js и не использует объект XMLHttpRequest。
Преимущества извлечения:
1. Соблюдайте разделение фокуса и не смешивайте входы, выходы и состояния, отслеживаемые событиями, в одном объекте
2. Лучший и удобный способ письма
Честно говоря, приведённые выше причины меня совсем не убедительны, потому что и Jquery, и Axios помогли нам хорошо инкапсулировать xhr и достаточно просты в использовании, почему нам всё равно приходится тратить много сил, чтобы научиться апортировать?
Я считаю, что основные преимущества апорта таковы:
1. Синтаксис лаконичен и более семантичен
2. На основе стандартной реализации обещаний, поддержка async/await
3. Изоморфное удобство, с использованием [изоморфного извлечения](https://github.com/matthew-andrews/isomorphic-fetch)
4. Более нижний уровень, предоставляющий богатые API (запрос, ответ)
5. Отделение от XHR — это новая реализация спецификации ES
fetch — это низкоуровневый API, который можно считать нативным XHR, поэтому он не очень удобен в использовании и требует инкапсулирования.
Например:
1) Fetch сообщает об ошибках только для сетевых запросов и рассматривает запросы 400 и 500 как успешные, при этом сервер не отклоняет при возврате кодов ошибок 400 или 500.
2) Fetch по умолчанию не хранит файлы cookie, нужно добавить элемент конфигурации: fetch(url, {учетные данные: 'include'})
3) fetch не поддерживает abort, не поддерживает контроль тайм-аута, а управление тайм-аутом, реализованное setTimeout и Promise.reeject, не может предотвратить продолжение работы процесса запроса в фоновом режиме, что приводит к потере трафика.
4) Fetch не может натурально отслеживать ход запросов, тогда как XHR может
|
Опубликовано 16.05.2019 13:28:28
|
|
|
|
Опубликовано 17.05.2019 18:16:39
|
Хозяин