Dela via


Lösa problem med resursdelning mellan ursprung i Microsoft Entra-programproxy

CORS (Cross-Origin Resource Sharing) kan innebära utmaningar för de appar och API:er som du publicerar via Microsoft Entra-programproxy. I den här artikeln beskrivs CORS-problem och lösningar för Microsoft Entra-programproxy.

Webbläsarsäkerhet hindrar vanligtvis en webbsida från att göra begäranden till en annan domän. Den här begränsningen kallas principen för samma ursprung. Principen förhindrar att en skadlig webbplats läser känsliga data från en annan webbplats. Ibland kanske du dock vill låta andra webbplatser anropa webb-API:et. CORS är en W3C-standard som dirigerar en server för att tillåta vissa begäranden mellan ursprung och avvisa andra.

Identifiera ett CORS-problem

Två URL:er har samma ursprung om de har identiska scheman, värdar och portar (RFC (Request For Comments) 6454), till exempel i det här exemplet:

  • http://contoso.com/foo.html
  • http://contoso.com/bar.html

Dessa URL:er har olika ursprung än de föregående två:

  • http://contoso.net: Olika domän
  • http://contoso.com:9000/foo.html: Annorlunda port
  • https://contoso.com/foo.html: Olika schema
  • http://www.contoso.com/foo.html: Olika underdomäner

Principen för samma ursprung hindrar appar från att komma åt resurser från andra ursprung om de inte använder rätt åtkomstkontrollhuvuden. Om CORS-huvudena saknas eller är felaktiga, misslyckas förfrågningar mellan olika ursprung.

Du kan identifiera CORS-problem med hjälp av felsökningsverktyg i webbläsaren:

  1. Öppna webbläsaren och gå till webbappen.
  2. Välj F12-nyckeln för att öppna felsökningskonsolen i DevTools.
  3. Försök att återskapa transaktionen och granska konsolmeddelandet. En CORS-överträdelse genererar ett konsolfel om ursprung.

I följande skärmbild orsakade valet av knappen Prova ett CORS-felmeddelande som https://corswebclient-contoso.msappproxy.net inte hittades i Access-Control-Allow-Origin-huvudet.

Skärmbild som visar ett exempel på ett CORS-problem.

CORS-utmaningar med applikationsproxy

I följande exempel visas ett typiskt CORS-scenario för Microsoft Entra-programproxy. Den interna servern är värd för en CORSWebService- webb-API-kontrollant och en CORSWebClient- som anropar CORSWebService. En Asynkron JavaScript- och XML-begäran (AJAX) görs från CORSWebClient till CORSWebService.

Skärmbild som visar en lokal begäran om samma ursprung.

CORSWebClient-appen fungerar lokalt men misslyckas eller visar ett fel när den publiceras via Microsoft Entra-programproxy. Om CORSWebClient och CORSWebService publiceras som separata appar finns de på olika domäner. De olika domänerna gör AJAX-begäranden från CORSWebClient till CORSWebService som korsar gränser mellan ursprung, vilket leder till att begärandena misslyckas.

Skärmbild som visar en CORS-begäran för programproxy.

Lösningar på CORS-problem med program-proxy

Du kan lösa det föregående CORS-problemet på flera sätt.

Alternativ 1: Konfigurera en anpassad domän

Använd en anpassad domän för Microsoft Entra-programproxy för att publicera från samma ursprung, utan att göra några ändringar i appens ursprung, kod eller rubriker.

Alternativ 2: Publicera den överordnade mappen

Publicera den överordnade katalogen för de två apparna. Den här lösningen fungerar särskilt bra om du bara har två appar på webbservern. I stället för att publicera varje app separat kan du publicera den gemensamma huvudkatalogen, vilket resulterar i samma ursprungsplats.

I följande exempel visas Microsoft Entra-programproxysidorna för CORSWebClient-appen . När den interna URL:en är inställd på contoso.com/CORSWebClient kan appen inte göra lyckade begäranden till contoso.com/CORSWebService-katalogen eftersom de är cross-origin.

Skärmbild som visar publicering av en app individuellt.

Ange i stället värdet för Intern URL för att publicera den överordnade katalogen, som innehåller både katalogerna CORSWebClient och CORSWebService :

Skärmbild som illustrerar publicering av en huvudkatalog.

De resulterande app-URL:erna löser effektivt CORS-problemet:

  • https://corswebclient-contoso.msappproxy.net/CORSWebService
  • https://corswebclient-contoso.msappproxy.net/CORSWebClient

Alternativ 3: Uppdatera HTTP-huvuden

Om du vill matcha ursprungsbegäran lägger du till ett anpassat HTTP-svarshuvud i webbtjänsten. Webbplatser som körs i Internet Information Services (IIS) använder IIS Manager för att ändra rubriken.

Skärmbild som visar hur du lägger till ett anpassat svarshuvud i IIS Manager.

Ändringen kräver inga kodändringar. Du kan verifiera det i en Fiddler-spårning.

**Post the Header Addition**\
HTTP/1.1 200 OK\
Cache-Control: no-cache\
Pragma: no-cache\
Content-Type: text/plain; charset=utf-8\
Expires: -1\
Vary: Accept-Encoding\
Server: Microsoft-IIS/8.5 Microsoft-HTTPAPI/2.0\
**Access-Control-Allow-Origin: https://corswebclient-contoso.msappproxy.net**\
X-AspNet-Version: 4.0.30319\
X-Powered-By: ASP.NET\
Content-Length: 17

Alternativ 4: Ändra programmet

Du kan ändra din applikation för att stödja CORS genom att lägga till huvud med lämpliga värden. Sättet att lägga till rubriken beror på applikationens programspråk. Det krävs mest arbete för att ändra koden.

Alternativ 5: Utöka livslängden för åtkomsttoken

Vissa CORS-problem kan inte lösas. Ditt program omdirigeras till exempel till login.microsoftonline.com för att autentisera och åtkomsttoken upphör att gälla. CORS-anropet misslyckas sedan. En lösning för det här scenariot är att förlänga livslängden för åtkomsttoken för att förhindra att den upphör att gälla under en användares session. Mer information finns i Konfigurerbara tokenlivslängder i Microsoft Entra ID.

Alternativ 6: Komplext program

För program som innehåller flera enskilda webbprogram där preflight-begärandenOPTIONS används kan du publicera apparna med hjälp av den komplexa programfunktionen. Mer information finns i Förstå komplexa program i Microsoft Entra-programproxy.