1.jQuery ajax
Tradičný Ajax označuje XMLHttpRequest(XHR), najstaršiu technológiu back-end requestov, ktorá sa objavila v pôvodnom js, a jadro používa objekt XMLHttpRequest.
JQuery ajax je enkapsuláciou natívneho XHR a pridáva podporu pre JSONP. Po rokoch aktualizácií a údržby je to naozaj veľmi pohodlné a netreba hovoriť o výhodách; Ak trváte na vymenovaní niekoľkých nedostatkov, môže to byť len:
1. Ide o programovanie pre MVC, ktoré nezodpovedá aktuálnej vlne front-end MVVM
2. Na základe natívneho vývoja XHR nie je samotná architektúra XHR jasná.
3. Celý projekt JQuery je príliš rozsiahly a je veľmi nerozumné zavádzať celý JQuery len pomocou ajaxu (prijatie personalizovaného balenia a nevyužívanie CDN služieb)
4. Nezodpovedá princípu oddelenia záujmov
5. Konfigurácia a volanie sú veľmi mätúce a asynchrónny model založený na udalostiach nie je priateľský.
PS:MVVM(Model-View-ViewModel), 源自于经典的 Model–View–Controller（MVC）模式。MVVM 的出现促进了 GUI 前端开发与后端业务逻辑的分离，极大地提高了前端开发效率。MVVM 的核心是 ViewModel 层，它就像是一个中转站（value converter），负责转换 Model 中的数据对象来让数据变得更容易管理和使用，该层向上与视图层进行双向数据绑定，向下与 Model 层通过接口请求进行数据交互，起呈上启下作用。View 层展现的不是 Model 层的数据，而是 ViewModel 的数据，由 ViewModel 负责与 Model 层交互，这就完全解耦了 View 层和 Model 层，这个解耦是至关重要的，它是前后端分离方案实施的最重要一环。
Ako je znázornené na nasledujúcom obrázku:
2.axios
Po Vue2.0 You Yuxi odporučil nahradiť JQuery ajax axios, čo muselo prinútiť axios dostať sa do očí mnohých ľudí.
axios je HTTP klient založený na sľuboch pre prehliadače a nodejs, ktorý je v podstate enkapsuláciou natívneho XHR, s tým rozdielom, že ide o implementáciu sľubov, ktorá spĺňa najnovšie špecifikácie ES a sám má nasledujúce vlastnosti:
1. Vytvorte XMLHttpRequest z vášho prehliadača
2. Podpora Promise API
3. Klientská podpora zabraňuje CSRF
4. Poskytnúť niektoré rozhrania pre súbežné požiadavky (dôležité, oveľa pohodlnejšie fungovanie)
5. Vytvorte HTTP požiadavku z node.js
6. Žiadosti a odpovede na zachytenie
7. Transformujte údaje o požiadavkách a odpovediach
8. Zrušenie žiadosti
9. Automatická konverzia JSON dát
PS:防止CSRF:就是让你的每个请求都带一个从cookie中拿到的key, 根据浏览器同源策略，假冒的网站是拿不到你cookie中得key的，这样，后台就可以轻松辨别出这个请求是否是用户在假冒网站上的误导输入，从而采取正确的策略。
3. aportovať
Fetch je prezentovaný ako alternatíva k AJAX, ktorý sa objavil v ES6 a používa objekt promise v ES6. Fetch je navrhnutý na základe sľubov. Štruktúra kódu v Fetch je oveľa jednoduchšia než v ajax a parametre sú trochu podobné jQuery ajax. Avšak nezabudnite na tofetch nie je ďalšou enkapsuláciou ajaxu, ale natívnym js a nepoužíva objekt XMLHttpRequest。
Výhody fetchu:
1. Dodržiavajte oddelenie fokusu a nemiešajte vstupy, výstupy a stavy sledované udalosťami v jednom objekte
2. Lepší a pohodlnejší spôsob písania
Úprimne, vyššie uvedené dôvody ma vôbec nepresvedčia, pretože Jquery aj Axios nám pomohli dostatočne zapuzdriť xhr a sú dosť jednoduché na používanie, prečo musíme stále vynaložiť toľko úsilia na učenie fetchu?
Myslím, že hlavné výhody aportu sú:
1. Syntax je stručná a viac sémantická
2. Na základe štandardnej implementácie sľubu podpora async/await
3. Izomorfná pohodlia, pomocou [izomorfný-fetch](https://github.com/matthew-andrews/isomorphic-fetch)
4. Viac na najnižšej úrovni, poskytujúce bohaté API (požiadavky, odpovede)
5. Odklon od XHR je nová implementácia v špecifikácii ES
fetch je nízkoúrovňové API, ktoré si môžete predstaviť ako natívne XHR, takže nie je veľmi pohodlné na používanie a musí byť zapuzdrované.
Napríklad:
1) fetch hlási chyby len pre sieťové požiadavky a považuje 400 a 500 za úspešné požiadavky, pričom server neodmietne pri vrátení chybových kódov 400 alebo 500.
2) fetch štandardne neprenáša cookies, musíte pridať konfiguračný element: fetch(url, {credentials: 'include'})
3) fetch nepodporuje abort, nepodporuje riadenie timeoutu a timeout control implementovaný setTimeout a Promise.reject nemôže zabrániť pokračovaniu procesu požiadavky na pozadí, čo vedie k plytvaniu prevádzkou
4) fetch nemá natívny spôsob monitorovania priebehu požiadaviek, zatiaľ čo XHR áno
|
Zverejnené 16. 5. 2019 13:28:28
|
|
|
|
Zverejnené 17. 5. 2019 18:16:39
|
Prenajímateľ