Priljubljena orodja in metode za simulacijo zahtev za navzkrižno porigin v lokalnih razvojnih okoljih se vrtijo predvsem za ravnanje in zaobijemo omejitve delitve virov (CORS), ki jih nalagajo brskalniki. Ta orodja pomagajo razvijalcem pri preizkušanju in odpravljanju medsebojnih interakcij navzkrižnih poreklov tako, da omogočajo CORS na lokalnih strežnikih, z uporabo pooblaščencev ali izkoriščanjem podaljškov in konfiguracij brskalnika. Spodaj so podrobne informacije o nekaterih skupnih pristopih in orodjih, ki se uporabljajo v ta namen.
Razumevanje CORS
Skupna raba virov (CORS) je varnostni mehanizem, ki se izvaja v brskalnikih, ki omejuje spletne aplikacije, ki delujejo na enem izvoru (domena, protokol, vrata), da dostopajo do virov na drugem izvoru, razen če strežnik izrecno ne dopušča s posebnimi glavami HTTP. CORS deluje s strežniki, ki pošiljajo glave, kot je "Access-Control-Allow-Origin", da navedejo, katere domene so dovoljene za dostop do virov. Brskalniki to uveljavijo tako, da pošljejo zahtevo za "predhodno" (zahteva za možnosti HTTP) za nekatere vrste navzkrižnih klicev, da preverijo dovoljenja, preden vložijo dejansko zahtevo. CORS Headers ne nadzoruje samo, kateri izvor je dovoljen, ampak tudi katere metode in glave HTTP lahko uporabijo in ali je mogoče poslati poverilnice, kot so piškotki.
Lokalni razvojni izzivi
Med lokalnim razvojem se projekti pogosto izvajajo na različnih pristaniščih ali domenah, ki štejejo za različen izvor in sproži omejitve CORS, kar otežuje testiranje navzkrižnih poreklov. Razvijalci potrebujejo orodja ali konfiguracije, ki simulirajo ali obidejo te omejitve lokalno, da omogočajo pravilno komunikacijo sprednjega in zadnjega dela, ne da bi vplivali na proizvodno okolje.
Orodja in metode za simuliranje ali zaostajanje CORS lokalno
1. lokalni strežniki
Proxying je ena najbolj robustnih in široko uporabljenih rešitev. Vključuje zagon proxy strežnika, ki deluje kot posrednik med odjemalcem in strežnikom API, in učinkovito usmerja zahteve za navzkrižno porigin z istim izvorom, da se izognete težavam s CORS.
-Razvojni strežniki z vgrajeno podporo proxy: Številna orodja za razvoj spredaj, kot so Vite, Webpack Dev Server ali Create React App Podpora za konfiguriranje proxyja. Na primer, Ustvari aplikacijo React omogoča razvijalcem, da določijo proxy v `packal.json` ali` setupproxy.js`, ki posreduje API kliče na drug strežnik, ki deluje na drugem pristanišču ali domeni. Tako brskalnik meni, da komunicira z istim izvorom, saj so zahteve postavljene na sam strežnik Dev, ki jih nato posreduje ciljnemu strežniku API -ja.
-Samostojni proxy strežniki: Orodja, kot so HTTP-Proxy-Middleware (za node.js) ali lokalni proxi, kot so Nginx, konfigurirani na lokalnih strojih, lahko služijo kot pooblaščenci za usmerjanje zahtev in dodajanje potrebnih glav CORS. Razvijalci lahko te strežnike konfigurirajo tako, da spremenijo odzive na muho, da vključijo `Access-Control-Allow-Origin: *` ali druge ustrezne glave.
2. KOPIRANCIJSKI KOMULNIK ZA KOPI
Še en učinkovit pristop je vodenje lokalnega primera API -ja, ki podpira CORS. Z uporabo Dockerja ali lokalnih nastavitev razvijalci zaženejo API na svojih strojih s CORS, omogočenimi v razvoju, kar omogoča, da se sprednji del, ki deluje na Localhostu, prosto komunicira brez omejitev. To ima prednosti popolnega nadzora in ni odvisnosti od zunanjih okolij.
3. Razširitve brskalnika za razvoj
Za hitro testiranje ali odpravljanje napak mnogi razvijalci uporabljajo razširitve brskalnika, ki začasno onemogočijo ali spreminjajo vedenje CORS v brskalnikih. Ta orodja je treba uporabljati samo v razvoju, nikoli v proizvodnji:
- CORS Unblock za Chrome: Ta razširitev spreminja glave zahtevkov in omogoča navzkrižne zahteve, tako da vbrizga potrebne glave na odzive, da zaobide uveljavitev CORS brskalnika.
- CORS povsod za Firefox: Podobno kot Chromejeva razširitev tudi vklopi in izklopi omejitve CORS, kar omogoča razvijalcem, da preizkusijo klice navzkrižne porekle, ne da bi spremenili konfiguracije strežnika.
- Meni za razvoj Safarija: Safari omogoča začasno onemogočanje omejitev navzkrižnega porekla v meniju, ki so uporabne za uporabnike Mac, ki opravljajo lokalno testiranje.
4. Zagon lokalnega spletnega strežnika namesto odpiranja datotek
En temeljni vzrok za napake CORS je nalaganje datotek neposredno s datoteko `datoteko: //` protokol v brskalnikih. Številne vadnice in vprašanja in vprašanja poudarjajo, da odpiranje strani HTML neposredno brez spletnega strežnika sproži napake CORS, ker brskalniki blokirajo številne operacije za varnost. Tako za izvajanje minimalnega lokalnega strežnika HTTP z orodji, kot je Pythonov vgrajen strežnik HTTP (`python3 -m http.server`), vozliški paket` http-server`, ali v živo-strežniku omogoča pravilen poreklo lokalnihhodov in se izogne te napake.
5. Spreminjanje glav odziva strežnika
Pri razvijanju lastnega API -ja ali zalednega storitev se običajno dodaja CORS Headers običajno z vključitvijo vmesne programske opreme ali konfiguriranjem spletnega strežnika za podporo CORS. Priljubljeni okvirji in jeziki so vzpostavili načine omogočanja CORS:
- Node.js/Express: Uporaba paketa `Cors` Middleware poenostavi dodajanje glave CORS.
- Spletni API ASP.NET: podpira atribute, kot so `[EnableCors]`, ki omogočajo določanje porekla, metod in glav, ki so dovoljene za zahteve za navzkrižno poreklo.
-Django: Middleware, kot je `Django-Cors-Headers`, se uporablja za lokalno podporo CORS.
6. Obiranje CORS z javnimi ali tretjimi pooblaščenci
Nekatere spletne storitve, kot je Beeceptor, omogočajo razvijalcem, da preizkusijo API -je in obvodajo CORS s usmerjanjem zahtevkov prek proxy strežnikov. Te storitve dodajo ustrezne glave CORS, zato brskalniki sprejemajo odzive. Ta pristop je uporaben za hitro odpravljanje napak, kadar lokalna nastavitev ni izvedljiva, vendar ga je treba uporabljati previdno in ne v proizvodnih okoljih.
***
Povzetek priljubljenih orodij in tehnik
- Proxying strežnika Dev: Uporaba proxy zmogljivosti v orodjih, kot je Vite, Create React App, Webpack Dev Server.
-Lokalni proxy strežniki: http-proxy-middleware v node.js, nginx konfigurirani kot proxy.
- Lokalni API z omogočenim CORS: z izvajanjem dockerjev zabojnikov ali lokalnih primerkov API -ja, konfiguriranih za razvoj s CORS.
- Razširitve brskalnika: CORS Unblock (Chrome), CORS povsod (Firefox), Safari onemogočijo omejitve navzkrižnega porekla.
-Lokalni strežnik HTTP: Zagon Pythonovega `http.server`, vozlišča` http-server` ali v živo namesto uporabe `datoteke: //` urls.
-Backdend Framework Middleware: `Cors` paket za node.js,` [EnableCors] `v spletnem API-ju asp.net,` django-cors-headers` za django.
- STORITVE TRETJIH PROXY: Beeceptor in podobne storitve začasno zaobidejo CORS.