Populiarūs įrankiai ir metodai, skirti imituoti kryžminio originalų užklausų vietinėje plėtros aplinkoje, visų pirma sukasi apie tvarkymo ir apeidimo kryžminio originalių išteklių dalijimosi (CORS) apribojimus, kuriuos nustato naršyklės. Šios priemonės padeda kūrėjams išbandyti ir derintis kryžminio originalų sąveiką, įgalinant COR vietiniuose serveriuose, naudojant tarpinius serverius arba panaudojant naršyklės plėtinius ir konfigūracijas. Žemiau yra išsami informacija apie kai kuriuos įprastus metodus ir įrankius, naudojamus šiam tikslui.
CORS supratimas
Kryžminio kilmės išteklių dalijimasis (CORS) yra saugos mechanizmas, įgyvendintas naršyklėse, ribojančias žiniatinklio programas, veikiančias vienoje kilmėje (domenas, protokolas, prievadas), kad būtų galima pasiekti išteklius kitoje kilmėje, nebent serveris aiškiai jį leidžia per konkrečias HTTP antraštes. CORS dirba serveriais, siunčiančiais atgal antraštes, tokias kaip „prieiga-kontrolė-originus“, kad nurodytų, kuriems domenams leidžiama pasiekti išteklius. Naršyklės tai įgyvendina siųsdami tam tikrų tipų kryžminio originalų skambučio užklausą (HTTP parinkčių užklausą), kad būtų galima patikrinti leidimus prieš pateikiant tikrąją užklausą. CORS antraštės kontroliuoja ne tik tai, kurios kilmės leidžiamos, bet ir kokie HTTP metodai ir antraštės gali būti naudojami, ir ar galima siųsti tokius kredencialus kaip slapukai.
Vietos plėtros iššūkiai
Vietos plėtros metu projektai dažnai vykdomi skirtinguose „Localhost“ prievaduose ar srityse, o tai yra skirtingos kilmės ir sukelia CORS apribojimus, todėl sunku atlikti bandymus kryžminio originalų užklausas. Kūrėjams reikia įrankių ar konfigūracijų, kurios imituoja ar apeina šiuos apribojimus vietoje, kad jų priekinė ir užpakalinė dalis galėtų tinkamai bendrauti, nepaveikdami gamybos aplinkos.
Įrankiai ir metodai, skirti imituoti ar apeiti COR vietoje
1. Vietinio serverio tarpinis serveris
Serveris yra vienas patikimiausių ir plačiausiai naudojamų sprendimų. Tai apima tarpinio serverio, kuris veikia kaip tarpininkas tarp kliento ir API serverio, paleidimą, veiksmingai nukreipia kryžminio originalo užklausas per tą pačią kilmę, kad būtų išvengta CORS problemų.
-Plėtros serveriai su įmontuotu tarpinio serverio palaikymu: daugelis priekinės dalies kūrimo įrankių, tokių kaip „Vite“, „Webpack Dev“ serveris, arba sukurkite „React App“ palaikymą sukonfigūruoti tarpinį serverį. Pvz., Sukurkite „React App“ programą leidžia kūrėjams apibrėžti tarpinį serverį „Package.json“ arba „SetupProxy.js“, kuris persiunčia API skambučius į kitą serverį, veikiantį kitame prievade ar domene. Tokiu būdu naršyklė mano, kad ji bendrauja su ta pačia kilme, nes užklausos pateikiamos pačiam „Dev“ serveriui, kuris tada persiunčia juos į tikslinį API serverį.
-Atskiros tarpinio serverio serveriai: Tokie įrankiai, tokie kaip „HTTP-Proxy-Middleware“ („Node.js“) arba vietiniai tarpiniai serveriai, tokie kaip „Nginx“, sukonfigūruoti vietinėse mašinose. Kūrėjai gali sukonfigūruoti šiuos serverius, kad pakeistų atsakymus skrendant, kad būtų įtraukta „prieiga-kontrolė-origin: *` ar kitos tinkamos antraštės.
2
Vietos API, palaikančios CORS, egzemplioriaus valdymas yra dar vienas efektyvus požiūris. Naudodamiesi „Docker“ ar vietinėmis sąrankomis, kūrėjai paleidžia API savo mašinose su COR įjungtais kūrimo režimu, o tai leidžia fronto galui veikti „Localhost“ laisvai bendrauti be apribojimų. Tai turi visiško kontrolės ir priklausomybės nuo išorinės aplinkos pranašumus.
3. Naršyklės plėtros plėtros plėtros
Greitai testavimui ar derinimui daugelis kūrėjų naudoja naršyklės plėtinius, kurie laikinai išjungia ar modifikuoja CORS elgesį naršyklėse. Šios priemonės turėtų būti naudojamos tik kuriant, niekada neuždirbant:
- CORS atblokuoti „Chrome“: Šis plėtinys keičia užklausų antraštes ir įgalina kryžminio originavimo užklausas, įšvirkščiant reikiamas antraštes atsakant į apeiti naršyklės CORS vykdymą.
- CORS visur „Firefox“: Panašiai kaip „Chrome“ plėtinys, jis perjungia CORS apribojimus įjungti ir išjungti, leidžiant kūrėjams išbandyti kryžminio originalų skambučius nekeičiant serverio konfigūracijų.
- „Safari“ kūrimo meniu: „Safari“ leidžia laikinai išjungti kryžminio originalų apribojimus per meniu, naudingą „Mac“ vartotojams, atliekantiems vietinius bandymus.
4. Vietos žiniatinklio serverio paleidimas, užuot atidaręs failus
Viena pagrindinė CORS klaidų priežastis yra failų įkėlimas tiesiogiai su „failu: //` protokolu naršyklėse. Daugelis vadovėlių ir klausimų ir atsakymų pabrėžia, kad HTML puslapių atidarymas tiesiogiai be žiniatinklio serverio sukelia „Cors“ klaidas, nes naršyklės blokuoja daugybę saugumo operacijų. Taigi, paleidžiant minimalų vietinį HTTP serverį, naudojant tokius įrankius kaip „Python“ įmontuotas HTTP serveris (`Python3 -m http.server`), mazgo„ HTTP-Server “paketas arba tiesioginis serveris leidžia teisingai lokalios kilmę ir išvengia šių klaidų.
5. Serverio atsakymo antraštės modifikuojančios antraštės
Kuriant savo API ar „backend“ paslaugą, CORS antraštės pridedama paprastai įtraukiant tarpinę programinę įrangą arba sukonfigūruojant žiniatinklio serverį CORS palaikymui. Populiarios pagrindinės sistemos ir kalbos nustatė COR įgalinimo būdus:
- „Node.js“/„Express“: „CORS“ tarpinės programinės įrangos paketo naudojimas supaprastina CORS antraščių pridėjimą.
- ASP.NET žiniatinklio API: palaiko tokius atributus kaip `[EnableCors]`, leidžiantys nurodyti kilmę, metodus ir antraštes, leidžiančias pateikti kryžminio originalų užklausas.
-„Django“: Tokia tarpinė programinė įranga, kaip „Django-Cors-Headers“, naudojama CORS palaikymui įjungti vietoje.
####.
Kai kurios internetinės paslaugos, tokios kaip „Beeceptor“, leidžia kūrėjams išbandyti API ir apeiti COR, nukreipiant užklausas per savo tarpinio serverio serverius. Šios paslaugos prideda tinkamas „Cors“ antraštes, todėl naršyklės priima atsakymus. Šis metodas yra naudingas greitam derinimui, kai vietinė sąranka neįmanoma, tačiau turėtų būti naudojama atsargiai, o ne gamybos aplinkoje.
***
populiarių įrankių ir technikos santrauka
- „Dev Server Proxying“: naudojant tarpinių serverių galimybes tokiose įrankiuose kaip „Vite“, sukurkite „React App“, „Webpack Dev Server“.
-Vietiniai tarpinių serverių serveriai: http-proxy-middleware in node.js, nginx sukonfigūruotas kaip tarpinis serveris.
- Vietinė API su CORS įgalinta: paleidimo „Docker“ konteineriai arba vietiniai API egzemplioriai, sukonfigūruoti plėtrai su CORS.
- Naršyklės plėtiniai: „Cors Unblock“ („Chrome“), CORS visur („Firefox“), „Safari“ išjungimo kryžminio originalo apribojimai.
-Vietinis HTTP serveris: „Python“ „http.server“, mazgo „http-server“ arba „Live-Server“, užuot naudojęs „failas: //` urls “, paleidimas.
-„Backend Framework“ tarpinė programinė įranga: „CORS“ paketas, skirtas „Node.js“, `[EnableCors]` ASP.NET žiniatinklio API, „Django-Cors-Headers“ „Django“.
- Trečiųjų šalių įgaliojimo paslaugos: Beeceptoriai ir panašios paslaugos laikinai apeiti COR.