Ajax ja Fetch ovat molemmat JavaScript-tekniikoita, joita käytetään lähettämään pyyntöjä asiakkaalta palvelimelle tietojen saamiseksi, mutta niiden välillä on joitain merkittäviä eroja. Tässä on yksityiskohtainen vertailu kahdesta tekniikasta:
1. Tekninen perusta ja toteutustavat
Ajax：
Pohja: Ajax on lyhenne sanoista Asynchronous JavaScript and XML (asynkroninen JavaScript ja XML). Se on tekniikka, joka voi päivittää osan verkkosivusta lataamatta koko sivua uudelleen.
Menetelmä toteuttaa : Ajax käyttää yleensä XMLHttpRequest-objektia pyyntöjen ja vastausten käsittelyyn. Tämän menetelmän syntaksi on suhteellisen monimutkainen, ja takaisinkutsutoimintojen ja -tilojen käsittelemiseksi on kirjoitettava enemmän koodia.
Hae：
Pohja: Fetch on nykyaikaisen JavaScriptin API, joka tarjoaa yhteisen määritelmän Request and Response -objekteille verkkopyyntöjen käsittelyä varten.
Menetelmä toteuttaa : Fetch käyttää Promise-objekteja asynkronisten toimintojen käsittelemiseen, ja niitä voidaan kutsua ketjuissa, mikä tekee koodista helpompi ymmärtää ja ylläpitää. Fetchin API-tyyli on ytimekkäämpi ja tehokkaampi.
2. Asynkroninen käsittely ja koodaustyyli
Ajax：
Asynkroninen käsittely: Ajax käyttää takaisinsoittotoimintoja asynkronisten toimintojen käsittelemiseen, mikä voi johtaa takaisinsoitto-helvetti-ongelmiin, erityisesti monimutkaisissa pyyntöketjuissa.
koodaustyyli: Ajaxin koodaustyyli on suhteellisen perinteinen ja vaatii pyyntöjen ja vastausten monien näkökohtien manuaalista käsittelyä.
Hae：
Asynkroninen käsittely : Hae käyttää Promise-objekteja asynkronisten toimintojen käsittelemiseen, mikä tekee asynkronisten pyyntöjen käsittelystä joustavampaa ja tiiviimpää. Voit käyttää async/await-toimintoa kirjoittaaksesi selkeän asynkronisen koodin ja välttääksesi takaisinsoitto-helvetin ongelman.
koodaustyyli: Fetchin koodityyli on nykyaikaisempi ja ytimekkäämpi, helppo ymmärtää ja ylläpitää.
3. Verkkotunnusten väliset pyynnöt ja CORS
Ajax：
verkkotunnusten välinen pyyntö : Ajax-pyynnöt voivat kattaa eri verkkotunnuksia, mutta CORS-ongelmat (Cross-Origin Resource Sharing) on käsiteltävä asianmukaisesti. Ajax voi tehdä verkkotunnusten välisiä pyyntöjä teknologioiden, kuten JSONP- ja välityspalvelinten, kautta.
Hae：
verkkotunnusten välinen pyyntö : Fetchillä on tiukemmat rajoitukset verkkotunnusten välisille pyynnöille, koska se noudattaa samaa alkuperää koskevaa käytäntöä. Jos vaaditaan verkkotunnusten välisiä pyyntöjä, palvelinpuolelle on asetettava asianmukaiset CORS-otsikot, jotta verkkotunnusten väliset pyynnöt sallitaan. Hakupyynnöt voivat käsitellä CORS-ongelmia automaattisesti, mutta ne voivat vaatia lisämäärityksiä joissakin tapauksissa.
4. Muut ominaisuudet
Ajax：
joustavuus: Ajax voi mukauttaa pyyntöjen otsikoita, pyyntötekstejä, vastausmuotoja jne. tarjoten suurta joustavuutta.
yhteensopivuus: Ajaxilla saattaa olla yhteensopivuusongelmia vanhemmissa selainversioissa, mutta nykyaikaisten selainten suosion myötä tämä ongelma on parantunut huomattavasti.
Hae：
Mukana aikakatkaisukäsittely: Haku voi keskeyttää pyynnön automaattisesti pyynnön aikakatkaisun jälkeen, jolloin vältytään pitkältä odottamiselta.
vastausten käsittely: Fetch tarjoaa lukuisia menetelmiä vastaustietojen käsittelemiseen, kuten .json(), .text(), .blob() jne., mikä tekee vastaustietojen käsittelystä helpompaa.
käyttö
fetch Se on moderni ja tehokas JavaScript-verkkopyyntö API, joka tarjoaa yksinkertaisen ja loogisen tavan saada resursseja asynkronisesti verkon yli.fetch Palauta aPromise , mikä tekee siitä helpon käyttää JavaScriptin async/await-syntaksin kanssa. Tässä on joitain esimerkkejä peruskäytöstä:
