Populārie rīki un metodes, kā simulēt dažādu izcelsmes pieprasījumu vietējās attīstības vidē, galvenokārt ir saistīta ar pārlieku izcelsmes resursu apmaiņas (CORS) ierobežojumiem, ko uzliek pārlūkprogrammas. Šie rīki palīdz izstrādātājiem pārbaudīt un atkļūdot savstarpējās izcelsmes mijiedarbību, ļaujot vietējiem serveriem, izmantojot starpniekserverus, vai izmantojot pārlūka paplašinājumus un konfigurācijas. Zemāk ir detalizēta informācija par dažām kopīgām pieejām un rīkiem, ko izmanto šim nolūkam.
Izpratne par COR
Cross-Origin Resursu koplietošana (CORS) ir drošības mehānisms, kas ieviests pārlūkprogrammās, kas ierobežo tīmekļa lietojumprogrammas, kas darbojas uz vienas izcelsmes (domēns, protokols, ports) no piekļuves resursiem uz atšķirīgu izcelsmi, ja vien serveris to skaidri neļauj, izmantojot īpašas HTTP galvenēs. CORS darbojas serveros, nosūtot atpakaļ galvenes, piemēram, piekļuves kontroli-allow-origin`, lai norādītu, kuriem domēniem ir atļauts piekļūt resursiem. Pārlūkprogrammas to īsteno, nosūtot “Preflight” pieprasījumu (HTTP opciju pieprasījums) noteikta veida pārraidē zvaniem, lai pārbaudītu atļaujas pirms faktiskā pieprasījuma iesniegšanas. CORS galvenes kontrolē ne tikai to, kas ir atļauts, bet arī to, kuras HTTP metodes un galvenes var izmantot, un vai var nosūtīt akreditācijas datus, piemēram, sīkfailus.
Vietējās attīstības izaicinājumi
Vietējās attīstības laikā projekti bieži darbojas dažādos lokālos ostās vai domēnos, kas tiek uzskatīti par atšķirīgu izcelsmi un izraisa CORS ierobežojumus, apgrūtinot pārrobežu pieprasījumu pārbaudi. Izstrādātājiem ir nepieciešami rīki vai konfigurācijas, kas simulē vai apiet šos ierobežojumus lokāli, lai to priekšgalā un aizmugurē būtu pareizi sazināties, neietekmējot ražošanas vidi.
Rīki un metodes, kā vietējā mērogā simulēt vai apietu COR
1. vietējā servera starpniekservera
Starpniekservera ir viens no spēcīgākajiem un plaši izmantotākajiem risinājumiem. Tas ietver starpniekservera palaišanu, kas darbojas kā starpnieks starp klientu un API serveri, efektīvi maršrutējot savstarpējās izcelsmes pieprasījumus, izmantojot to pašu izcelsmi, lai izvairītos no CORS problēmām.
-Attīstības serveri ar iebūvētu starpniekservera atbalstu: daudzi priekšējās daļas izstrādes rīki, piemēram, VITE, Webpack Dev Server vai Create React lietotnes atbalsts starpniekservera konfigurēšanu. Piemēram, Create React lietotne ļauj izstrādātājiem definēt starpniekserveri `paketē.json` vai` setUpProxy.js`, kas pārsūta API zvanus uz citu serveri, kas darbojas citā portā vai domēnā. Tādā veidā pārlūkprogramma domā, ka tā sazinās ar tādu pašu izcelsmi, jo pieprasījumi tiek veikti pašam Dev serverim, kas pēc tam tos pārsūta uz mērķa API serveri.
-Atsevišķi starpniekservera serveri: tādi rīki kā HTTP-Proxy-Middleware (for Node.js) vai vietējie starpnieki, piemēram, NGINX, kas konfigurēti vietējās mašīnās, var kalpot kā starpniekserveris maršruta pieprasījumiem un pievienot nepieciešamās CORS galvenes. Izstrādātāji var konfigurēt šos serverus, lai mainītu atbildes lidojumā, lai iekļautu `piekļuves kontroli-allow-origin: *` vai citas atbilstošas galvenes.
2. CORS iespējotās vietējās API kopijas
Vēl viena efektīva pieeja ir API vietējā gadījuma vadīšana, kas atbalsta CORS. Izmantojot Docker vai vietējos iestatījumus, izstrādātāji palaiž API savās mašīnās ar COR iespējotiem izstrādes režīmā, kas ļauj priekšgala darbībai vietējāhostā brīvi sazināties bez ierobežojumiem. Tam ir pilnīgas vadības priekšrocības un nav atkarības no ārējās vides.
3. pārlūka paplašinājumi attīstībai
Ātrai pārbaudei vai atkļūdošanai daudzi izstrādātāji izmanto pārlūka paplašinājumus, kas pārlūkprogrammās atspējo vai modificē COR izturēšanos. Šie rīki jāizmanto tikai attīstībā, nekad ražošanā:
- CORS atbloķēšana hromam: Šis paplašinājums modificē pieprasījuma galvenes un nodrošina pārrobežu pieprasījumus, ievadot nepieciešamās galvenes reakcijai, lai apietu pārlūka CORS izpildi.
- CORS visur Firefox: Līdzīgi kā Chrome paplašinājums, tas pārslēdz CORS ierobežojumus ieslēgtus un izslēgtus, ļaujot izstrādātājiem pārbaudīt savstarpējo izcelsmes zvanus, nemainot servera konfigurācijas.
- Safari Izstrādāt izvēlni: Safari ļauj īslaicīgi atspējot savstarpējās izcelsmes ierobežojumus, izmantojot izvēlni, kas ir noderīgi Mac lietotājiem, kuri veic vietējo testēšanu.
4. Vietējā tīmekļa servera palaišana, nevis failu atvēršana
Viens no COR pamatcēloņiem ir failu ielāde tieši ar failu: // `protokolu pārlūkprogrammās. Daudzas konsultācijas un Q&A norāda, ka HTML lapu atvēršana tieši bez tīmekļa servera izraisa CORS kļūdas, jo pārlūkprogrammas bloķē daudzas drošības operācijas. Tādējādi, palaižot minimālu vietējo HTTP serveri, izmantojot tādus rīkus kā Python iebūvētais HTTP serveris (`python3 -m http.server`), Mezgla` http-server` pakotne vai tiešraides serveris ļauj pareizām lokālas oriģināliem un izvairīties no šīm kļūdām.
5. modificējot servera atbildes galvenes
Izstrādājot savu API vai aizmugures pakalpojumu, CORS galveņu pievienošana parasti tiek veikta, iekļaujot starpprogrammatūru vai konfigurējot tīmekļa serveri COR atbalstam. Populārie aizmugures ietvari un valodas ir izveidojuši veidus, kā dot iespēju COR:
- Node.js/Express: izmantojot “Cors` starpprogrammatūras pakotni vienkāršo Cors galveņu pievienošanu.
- ASP.NET Web API: atbalsta tādus atribūtus kā `[EnableCors]`, kas ļauj norādīt uz izcelsmi, metodēm un galvenēm, kas atļautas savstarpēji izcelsmes pieprasījumiem.
-Django: Starpprogrammatūra, piemēram, `Django-Cors-Headers`, tiek izmantota, lai COR varētu atbalstīt vietējo atbalstu.
6. Apejot kors ar publiskiem vai trešo personu starpniekserveri
Daži tiešsaistes pakalpojumi, piemēram, beekeptors, ļauj izstrādātājiem pārbaudīt API un apiet COR, maršrutējot pieprasījumus, izmantojot starpniekserverus. Šie pakalpojumi pievieno atbilstošās Cors galvenes, tāpēc pārlūkprogrammas pieņem atbildes. Šī pieeja ir noderīga ātrai atkļūdošanai, ja vietējā iestatīšana nav iespējama, bet tā ir jāizmanto piesardzīgi, nevis ražošanas vidē.
***
populāru rīku un paņēmienu kopsavilkums
- Dev servera starpniekservera: Izmantojot starpniekservera iespējas tādos rīkos kā VITE, Create React App, Webpack Dev Server.
-vietējie starpniekservera serveri: http-proxy-middleware vietnē node.js, nginx, kas konfigurēts kā starpniekserveris.
- Vietējā API ar iespējotu COR: Docker konteineru vai vietējo API gadījumi, kas konfigurēti izstrādei ar CORS.
- Pārlūka pagarinājumi: Cors atbloķēt (hroms), CORS visur (Firefox), safari atspējot savstarpējās izcelsmes ierobežojumus.
-Vietējais HTTP serveris: palaižot Python's `http.server`, Node's` http-server` vai tiešraides serveri, tā vietā, lai izmantotu `failu: //` URLS.
-Backend Framework starpprogrammatūra: `CORS` pakete no Node.js,` [EnableCors] `ASP.NET Web API," Django-Cors-headgers` Django.
- Trešās puses starpniekservera pakalpojumi: beekeptors un līdzīgi pakalpojumi, lai īslaicīgi apietu COR.