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, You Yuxi препоръча да замените 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, а е native js и не използва обекта XMLHttpRequest。
Предимства на fetch:
1. Спазвайте разделянето на фокуса и не смесвайте входове, изходи и състояния, проследявани от събития, в един обект
2. По-добър и по-удобен начин за писане
Честно казано, горните причини изобщо не ми звучат убедително, тъй като и Jquery, и Axios ни помогнаха да капсулираме xhr достатъчно добре и са лесни за използване, защо все пак трябва да влагаме много усилия, за да научим fetch?
Мисля, че основните предимства на fetch са:
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 по подразбиране не съдържа бисквитки, трябва да добавите конфигурационен елемент: fetch(url, {credentials: 'include'})
3) fetch не поддържа прекъсване, не поддържа контрол на тайм-аут, а контролът за тайм-аута, реализиран от setTimeout и promise.rece, не може да предотврати продължаването на процеса на заявка да продължи да работи във фонов режим, което води до загуба на трафик
4) fetch няма начин нативно да следи хода на заявките, докато XHR може
|
Публикувано в 16.05.2019 г. 13:28:28 ч.
|
|
|
|
Публикувано в 17.05.2019 г. 18:16:39 ч.
|
Хазяин