Oprava: Žiadna chyba hlavičky access-control-allow-origin v Angular

Jednou z najbežnejších chybových správ, s ktorými sa vývojoví pracovníci spoločnosti Angular môžu stretnúť v každodennej práci, sú: na požadovanom prostriedku nie je k dispozícii hlavička access-control-allow-origin.

Nejde o konkrétny uhlový problém, ale o CORS (Cross-Origin Resource Sharing). Môže to znamenať, že server typu back-end je nakonfigurovaný na prácu na inom porte alebo doméne.

---

Ako môžem opraviť chybu Žiadna kontrola prístupu v systéme Windows 10?

1. Vykonajte zmeny na úrovni servera

Ak máte prístup na server, povoľte požiadavky CROS pridaním Access-Control-Allow-Origin: * hlavička. Potom nakonfigurujte kory vstup, pod system.webServer v web.config súboru, ako v príklade nižšie.

• ”1.0″?
• povolené =„Pravda“>
• pôvod =“ https://someorigin.domain.com”>
• metóda =„ZÍSKAŤ“/>
• metóda =„HLAVA“/>
• </system.webServer>

Tu, kory dovolí ZÍSKAJTE a HLAVA žiadosti od https://someorigin.domain.com/.

Tiež ak používate IIS (internetová informačná služba) budete si musieť stiahnuť Modul IIS CORS.

Namiesto * zadajte doménu alebo zoznam domén. V opačnom prípade by boli požiadavky krížového pôvodu na server povolené odkiaľkoľvek.

On Apache, v konfiguračnom súbore musíte pridať riadok Sada hlavičiek Access-Control-Allow-Origin „*“. Opäť je rozumné nahradiť znak „*“ zoznamom zdrojov, z ktorých by sa žiadosti mohli odosielať.

---

2. Spustite svoj vlastný server proxy

1. Najskôr vytvoríme konfiguračný súbor proxy v koreňovom priečinku Angular s názvom src / proxy.conf.json, a napíš do neho nasledujúci kód:
   • {"/ api":
   • "target": " http://localhost: 6000 "," zabezpečené ": false}
   • }
2. Po druhé, v angular.jsonsúbor, pridajte proxyConfigmožnosť v slúžiť cieľ:
   • "slúžiť": {
   • „staviteľ“:" ",
     
   • "možnosti":{„proxyConfig“:„src / proxy.conf.json“}
     
   • }
3. Teraz spustite aktuálnu konfiguráciu pomocou ng slúžiť príkaz.

Server proxy pošle vaše požiadavky na vzdialený server. Ďalej sa pozrieme na to, ako nakonfigurovať proxy server.

Žiadosti o údaje v Angular sú volania API na localhost, na porte 4200, ako je toto umiestnenie:

• http://localhost: 4200 / api / datareq.

Vo vyššie uvedenom príklade sme však predpokladali, že požadované údaje sú na toto umiestnenie:

• http://localhost: 6000 / api / datareq.

---

Máte záujem o dobré proxy riešenia? Pozrite si tento zoznam vyhradených nástrojov

---

3. Dvo svojom prehliadači môžete použiť rovnaké zásady pôvodu

Poznámka: táto konkrétna metóda sa neodporúča, pretože to môže váš prehliadač (a váš systém) vystaviť veľkým bezpečnostným rizikám.

Ak všetko ostatné nefunguje, môžete sa uchýliť k deaktivácii rovnakých zásad pôvodu v prehliadači. Buďte však opatrní, pretože by to váš prehliadač (a váš systém) vystavilo veľkým bezpečnostným rizikám.

Pre Google Chrome, v systéme Windows 10, otvorte príkazový riadok ako správca a spustite nasledujúci príkaz:

C: Program Files (x86) GoogleChromeApplicationchrome.exe "--disable-web-security --disable-gpu --user-data-dir = ~ / chromeTemp..

Na záver, na požadovanom prostriedku nie je k dispozícii hlavička access-control-allow-origin chybové hlásenie je problém na strane servera.

Pre vývojárov Angular by úprava konfigurácie servera alebo použitie servera proxy mali fungovať úplne v poriadku.

V nasledujúcej sekcii komentárov nám povedzte, čo si myslíte o tomto sprievodcovi.

---

---