Sdílet prostřednictvím

CORS a WebAPI

  • Článek

V rámci solution máme dva webové projekty – Web (javascriptová single-page aplikace) a WebAPI(backend s API). v ASP.NET Core 2.0. Řešili jsme problém, že nám nefungoval spolehlivě CORS – javascriptové requesty z Webu nedostávaly správné odpovědi od WebAPI. Chovalo se to velmi podivně i přesto, že lokálně vše fungovalo, a to i když aplikace běžely na různých portech.

Konkrétně:

  • Některé GET requesty fungovaly i v testovacím prostředí, ale POST, PUT a DELETE requesty nikdy.
  • GET requesty browser někdy zdvojoval (zejména v Safari na Macu), první vždy prošel (status code 200) a druhý neprošel (status code 403)
  • V Developer tools v Chrome, ani v Safari nejsou vidět autorizační hlavičky i přesto, že uživatel je přihlášený (při odchycení requestu Fiddlerem tam skutečně jsou). Ovšem na localhostu jsou vidět autorizační hlavičky vždy.

CORS v aplikaci máme nastaven celkem standardně a nepříliš restriktivně:

2018-04-10-CORS-settings

Kde byl(y) problém(y):

Nejdříve jsme neměli povolené všechny hlavičky (pozor zejména na Authorization, která není v Chrome Developer tools defaultně vidět). Nakonec jsme stejně skočili u AllowAnyHeader() .

Důležité je mít povoleno AllowCredentials(), pokud řešíte přihlašování

Na co nám nejdéle trvalo přijít je, že je potřeba povolit anonymní autentifikaci i když v aplikaci žádné anonymní požadavky nejsou potřeba (povoluje se to v IIS na obrázku níže). Je potřeba na to ovšem myslet a v aplikaci si ošetřit, že uživatel musí být přihlášen při běžném přístupu do aplikace.

2018-04-10-CORS-IIS

Na pozadí CORS funguje tak, že vzdálený klient nejdříve udělá tzv. preflight request metodou OPTIONS a v hlavičce pošle informace, na jakou URL chce jakou metodou kdo přistupovat. Pokud není povolena anonymní autentifikace, OPTIONS požadavek selže (vrátí 401), protože v hlavičce preflight requestu se dle specifikace https://fetch.spec.whatwg.org/#cors-preflight-fetch autorizační hlavička neposílá. V takovém případě vzdálený klient není schopný zjistit, zda bude mít oprávnění udělat skutečný požadavek, a tak celá komunikace selže (nebo se chová nepředvídatelně – viz podivnosti výše).

Technické podrobnosti např. zde: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

Nakonec pro přehlednost ještě schéma posílání CORS požadavků:

2018-04-10-CORS-schema

Robert Haken, HAVIT