1.jQuery ajax
Traditionel Ajax refererer til XMLHttpRequest(XHR), den tidligste backend-anmodningsteknologi, der optrådte i den oprindelige js, og kernen bruger XMLHttpRequest-objektet.
JQuery ajax er en indkapsling af native XHR og tilføjer understøttelse af JSONP. Efter mange års opdatering og vedligeholdelse er det virkelig meget bekvemt, og fordelene behøver ikke nævnes; Hvis du insisterer på at nævne nogle få mangler, kan det kun være:
1. Det er programmering til MVC, som ikke følger den nuværende bølge af front-end MVVM 2. Baseret på native XHR-udvikling er arkitekturen for XHR i sig selv uklar. 3. Hele JQuery-projektet er for stort, og det er meget urimeligt at introducere hele JQuery udelukkende ved hjælp af ajax (ved at anvende en personlig pakkeløsning og ikke nyde CDN-tjenester) 4. Det er ikke i overensstemmelse med princippet om adskillelse af anliggender 5. Konfigurationen og påkaldelsen er meget forvirrende, og den begivenhedsbaserede asynkrone model er ikke venlig.
PS:MVVM(Model-View-ViewModel), 源自于经典的 Model–View–Controller(MVC)模式。MVVM 的出现促进了 GUI 前端开发与后端业务逻辑的分离,极大地提高了前端开发效率。MVVM 的核心是 ViewModel 层,它就像是一个中转站(value converter),负责转换 Model 中的数据对象来让数据变得更容易管理和使用,该层向上与视图层进行双向数据绑定,向下与 Model 层通过接口请求进行数据交互,起呈上启下作用。View 层展现的不是 Model 层的数据,而是 ViewModel 的数据,由 ViewModel 负责与 Model 层交互,这就完全解耦了 View 层和 Model 层,这个解耦是至关重要的,它是前后端分离方案实施的最重要一环。
Som vist i følgende figur:
2. aksios
Efter Vue2.0 anbefalede You Yuxi, at du erstattede JQuery ajax med axios, hvilket må have fået axios til at fange mange menneskers opmærksomhed.
axios er en HTTP-klient baseret på promises for browsere og nodejs, som i bund og grund er en indkapsling af native XHR, bortset fra at det er en implementering af promises, der overholder de nyeste ES-specifikationer, og den har selv følgende karakteristika:
1. Opret en XMLHttpRequest fra din browser 2. Support Promise API 3. Kundesupport forhindrer CSRF 4. At tilbyde nogle grænseflader til samtidige forespørgsler (vigtig, meget mere bekvem operation) 5. Opret en HTTP-anmodning fra node.js 6. Opsnapningsanmodninger og svar 7. Transformér anmodnings- og svardata 8. Annullering af anmodningen 9. Konverter automatisk JSON-data
PS:防止CSRF:就是让你的每个请求都带一个从cookie中拿到的key, 根据浏览器同源策略,假冒的网站是拿不到你cookie中得key的,这样,后台就可以轻松辨别出这个请求是否是用户在假冒网站上的误导输入,从而采取正确的策略。
3. hent
Fetch markedsføres som et alternativ til AJAX, som optrådte i ES6 og bruger promise-objektet i ES6. Hent er designet ud fra løfter. Fetchs kodestruktur er meget enklere end ajax, og parametrene minder lidt om jQuery ajax. Men husk detFetch er ikke en yderligere indkapsling af Ajax, men native JS og bruger ikke XMLHttpRequest-objektet。
Fordele ved fetch:
1. Overhold fokusseparation, og bland ikke input, output og tilstande sporet af begivenheder i ét objekt 2. Bedre og mere bekvem måde at skrive på Ærligt talt er ovenstående grunde slet ikke overbevisende for mig, fordi både Jquery og Axios har hjulpet os med at indkapsle xhr godt nok og er nemme nok at bruge, hvorfor skal vi stadig bruge så meget energi på at lære fetch?
Jeg mener, at de største fordele ved fetch er:
1. Syntaksen er kortfattet og mere semantisk 2. Baseret på standard promise-implementering, understøttelse asynkron/await 3. Isomorf bekvemmelighed, ved brug af [isomorf-hent](https://github.com/matthew-andrews/isomorphic-fetch) 4. Mere bundniveau, der leverer rige API'er (anmodning, svar) 5. At bryde ud af XHR er en ny implementering i ES-specifikationen For nylig, når jeg bruger fetch, er jeg også stødt på mange problemer: fetch er et lavniveau-API, som du kan tænke på som en native XHR, så det er ikke så behageligt at bruge og skal indkapsles. For eksempel:
1) fetch rapporterer kun fejl for netværksforespørgsler og behandler 400 og 500 som succesfulde forespørgsler, og serveren vil ikke afvise ved retur af 400 eller 500 fejlkoder. 2) fetch bærer ikke cookies som standard, du skal tilføje et konfigurationselement: fetch(url, {credentials: 'include'}) 3) fetch understøtter ikke abort, understøtter ikke timeout-kontrol, og timeout-kontrollen implementeret af setTimeout og Promise.reject kan ikke forhindre anmodningsprocessen i at fortsætte i baggrunden, hvilket resulterer i spildt trafik 4) fetch har ingen måde at overvåge anmodningernes fremgang nativt, mens XHR kan Resumé: Axios tilbyder samtidig indkapsling uden problemerne med hent, og er lille i størrelse, hvilket gør det til den mest egnede anmodningsmetode nu.
|