1.jQuery ajax
Ajax tradițional se referă la XMLHttpRequest(XHR), cea mai timpurie tehnologie de solicitare back-end care a apărut în js-ul original, iar nucleul folosește obiectul XMLHttpRequest.
JQuery ajax este o încapsulare a XHR nativ și adaugă suport pentru JSONP. După ani de actualizare și întreținere, este cu adevărat foarte convenabil, iar avantajele nu trebuie menționate de aceea; Dacă insiști să enumeri câteva neajunsuri, s-ar putea să fie doar:
1. Este programare pentru MVC, care nu se conformează valului actual de MVVM front-end
2. Pe baza dezvoltării native XHR, arhitectura XHR în sine nu este clară.
3. Întregul proiect JQuery este prea mare și este foarte nerezonabil să introduci întregul JQuery folosind doar ajax (adoptând o soluție de ambalare personalizată și fără servicii CDN)
4. Nu se conformează principiului separării preocupărilor
5. Configurația și invocarea sunt foarte confuze, iar modelul asincron bazat pe evenimente nu este prietenos.
PS:MVVM(Model-View-ViewModel), 源自于经典的 Model–View–Controller（MVC）模式。MVVM 的出现促进了 GUI 前端开发与后端业务逻辑的分离，极大地提高了前端开发效率。MVVM 的核心是 ViewModel 层，它就像是一个中转站（value converter），负责转换 Model 中的数据对象来让数据变得更容易管理和使用，该层向上与视图层进行双向数据绑定，向下与 Model 层通过接口请求进行数据交互，起呈上启下作用。View 层展现的不是 Model 层的数据，而是 ViewModel 的数据，由 ViewModel 负责与 Model 层交互，这就完全解耦了 View 层和 Model 层，这个解耦是至关重要的，它是前后端分离方案实施的最重要一环。
Așa cum se vede în figura următoare:
2. axios
După Vue2.0, You Yuxi a recomandat să înlocuiești JQuery ajax cu axios, ceea ce probabil a făcut ca axios să intre în ochii multor oameni.
axios este un client HTTP bazat pe promise pentru browsere și nodejs, care este practic o încapsulare a XHR-ului nativ, cu excepția faptului că este o implementare a promisiunilor care respectă cele mai recente specificații ES și are următoarele caracteristici:
1. Creează o cerere XMLHttp din browser
2. Suport API Promise
3. Suportul pentru clienți previne CSRF
4. Furnizarea unor interfețe pentru cereri concurente (operațiune importantă, mult mai convenabilă)
5. Creează o cerere HTTP din node.js
6. Interceptarea cererilor și răspunsurilor
7. Transformarea datelor de cerere și răspuns
8. Anularea cererii
9. Convertirea automată a datelor JSON
PS:防止CSRF:就是让你的每个请求都带一个从cookie中拿到的key, 根据浏览器同源策略，假冒的网站是拿不到你cookie中得key的，这样，后台就可以轻松辨别出这个请求是否是用户在假冒网站上的误导输入，从而采取正确的策略。
3.aducă
Fetch este prezentat ca o alternativă la AJAX, care a apărut în ES6 și folosește obiectul promise în ES6. Fetch este conceput pe baza promisiunilor. Structura codului Fetch este mult mai simplă decât ajax, iar parametrii sunt puțin ca jQuery ajax. Totuși, nu uita să rețiifetch nu este o încapsulare suplimentară a ajax, ci js nativ și nu folosește obiectul XMLHttpRequest。
Avantajele fetch-ului:
1. Respectă separarea focalizării și nu amestecă intrările, ieșirile și stările urmărite de evenimente într-un singur obiect
2. Metodă mai bună și mai convenabilă de a scrie
Sincer, motivele de mai sus nu mă conving deloc, pentru că atât Jquery, cât și Axios ne-au ajutat să încapsulăm xhr suficient de bine și sunt destul de ușor de folosit, de ce tot trebuie să depunem mult efort să învățăm fetch?
Cred că principalele avantaje ale fetch sunt:
1. Sintaxa este concisă și mai mult semantică
2. Pe baza implementării standard a promisiunii, suport async/await
3. Comoditate izomorfă, folosind [izomorf-fetch](https://github.com/matthew-andrews/isomorphic-fetch)
4. Mai la nivel de bază, oferind API-uri bogate (cerere, răspuns)
5. Ruperea de XHR este o nouă implementare în specificația ES
fetch este un API de nivel scăzut pe care îl poți considera un XHR nativ, deci nu este foarte confortabil de folosit și trebuie încapsulat.
De exemplu:
1) fetch raportează doar erori pentru cererile de rețea și tratează 400 și 500 ca cereri reușite, iar serverul nu va respinge când returnează coduri de eroare 400 sau 500.
2) fetch nu transportă cookie-uri implicit, trebuie să adaugi un element de configurare: fetch(url, {credentials: 'include'})
3) fetch nu suportă abort, nu suportă controlul timeout-ului, iar controlul timeout-ului implementat de setTimeout și Promise.reject nu poate împiedica procesul de cerere să continue să ruleze în fundal, ceea ce duce la pierderea traficului
4) fetch nu are o modalitate nativă de a monitoriza progresul cererilor, în timp ce XHR poate
|
Postat pe 16.05.2019 13:28:28
|
|
|
|
Postat pe 17.05.2019 18:16:39
|
Proprietarul