CORS (Cross-Origin Resource Sharing) configureren voor Azure Container Apps

Aanvragen via de browser worden standaard geblokkeerd voor een domein dat niet overeenkomt met het oorspronkelijke domein van de pagina. U kunt CORS inschakelen om deze beperking te voorkomen voor services die zijn geïmplementeerd in Container Apps.

In dit artikel leest u hoe u CORS kunt inschakelen en configureren in uw container-app.

Wanneer u CORS inschakelt, kunt u de volgende instellingen configureren:

Instelling	Uitleg
Referenties toestaan	Geeft aan of de Access-Control-Allow-Credentials header moet worden geretourneerd.
Maximale leeftijd	Hiermee configureert u de Access-Control-Max-Age antwoordheader om aan te geven hoe lang (in seconden) de resultaten van een CORS-aanvraag vóór de flight in de cache kunnen worden opgeslagen.
Toegestane oorsprongen	Lijst met de oorsprongen die zijn toegestaan voor cross-origin-aanvragen (bijvoorbeeld https://www.contoso.com). Hiermee bepaalt u de Access-Control-Allow-Origin antwoordheader. Gebruik * dit om alles toe te staan.
Toegestane methoden	Lijst met HTTP-aanvraagmethoden die zijn toegestaan in cross-origin-aanvragen. Hiermee bepaalt u de Access-Control-Allow-Methods antwoordheader. Gebruik * dit om alles toe te staan.
Toegestane headers	Lijst met de headers die zijn toegestaan in cross-origin-aanvragen. Hiermee bepaalt u de Access-Control-Allow-Headers antwoordheader. Gebruik * dit om alles toe te staan.
Kopteksten beschikbaar maken	Standaard worden niet alle antwoordheaders blootgesteld aan JavaScript-code aan de clientzijde in een cross-origin-aanvraag. Weergegeven headers zijn extra headersservers die in een antwoord kunnen worden opgenomen. Hiermee bepaalt u de Access-Control-Expose-Headers antwoordheader. Gebruik * dit om alles beschikbaar te maken.

Eigenschappen	Uitleg	Type
allowCredentials	Geeft aan of de Access-Control-Allow-Credentials header moet worden geretourneerd.	boolean
maxAge	Hiermee configureert u de Access-Control-Max-Age antwoordheader om aan te geven hoe lang (in seconden) de resultaten van een CORS-aanvraag vóór de flight in de cache kunnen worden opgeslagen.	geheel getal
allowedOrigins	Lijst met de oorsprongen die zijn toegestaan voor cross-origin-aanvragen (bijvoorbeeld https://www.contoso.com). Hiermee bepaalt u de Access-Control-Allow-Origin antwoordheader. Gebruik * dit om alles toe te staan.	matrix tekenreeksen
allowedMethods	Lijst met HTTP-aanvraagmethoden die zijn toegestaan in cross-origin-aanvragen. Hiermee bepaalt u de Access-Control-Allow-Methods antwoordheader. Gebruik * dit om alles toe te staan.	matrix tekenreeksen
allowedHeaders	Lijst met de headers die zijn toegestaan in cross-origin-aanvragen. Hiermee bepaalt u de Access-Control-Allow-Headers antwoordheader. Gebruik * dit om alles toe te staan.	matrix tekenreeksen
exposeHeaders	Standaard worden niet alle antwoordheaders blootgesteld aan JavaScript-code aan de clientzijde in een cross-origin-aanvraag. Weergegeven headers zijn extra headersservers die in een antwoord kunnen worden opgenomen. Hiermee bepaalt u de Access-Control-Expose-Headers antwoordheader. Gebruik * dit om alles beschikbaar te maken.	matrix tekenreeksen

Zie voor meer informatie de Web Hypertext Application Technology Working Group (WHATWG) verwijzing naar geldige HTTP-antwoorden van een ophaalaanvraag.

CORS inschakelen en configureren

1. Ga naar uw container-app in Azure Portal.

2. Selecteer CORS onder het instellingenmenu.

   

Als CORS is ingeschakeld, kunt u waarden toevoegen, bewerken en verwijderen voor toegestane oorsprongen, toegestane methoden, toegestane headers en headers beschikbaar maken.

Als u acceptabele waarden voor methoden, headers of oorsprongen wilt toestaan, voert u * deze in als de waarde.

Notitie

Updates voor configuratie-instellingen via de opdrachtregel overschrijft uw huidige instellingen. Zorg ervoor dat u uw huidige instellingen opneemt in nieuwe CORS-waarden die u wilt instellen om ervoor te zorgen dat uw configuratie consistent blijft.

ARM-sjabloon

De volgende code vertegenwoordigt het formulier dat uw CORS-instellingen nemen in een ARM-sjabloon bij het configureren van uw container-app.

{ 
  ... 
  "properties": { 
      ... 
      "configuration": { 
         ... 
          "ingress": { 
              ... 
              "corsPolicy": { 
                "allowCredentials": true,
                "maxAge": 5000,
                "allowedOrigins": ["https://example.com"], 
                "allowedMethods": ["GET","POST"], 
                "allowedHeaders": [], 
                "exposeHeaders": []
              } 
          } 
      } 
  } 
}

YAML

De volgende code vertegenwoordigt het formulier dat uw CORS-instellingen nemen bij het configureren van uw container-app.

...
properties: 
  configuration: 
    ingress: 
    corsPolicy:
      allowCredentials: true
      maxAge: 5000
      allowedOrigins:
        - "https://example.com"
      allowedMethods:
        - "GET"
        - "POST"
      allowedHeaders: []
      exposeHeaders: []

Nadat u waarden hebt toegevoegd die specifiek zijn voor uw configuratie, kunt u de az containerapp ingress cors update CORS-configuratie voor uw container-app instellen.

Voordat u de volgende opdracht uitvoert, vervangt u tijdelijke aanduidingen tussen <> uw waarden.

az containerapp ingress cors update --name <APP_NAME> --resource-group <RESOURCE_GROUP> –yaml <YAML_FILE_NAME>

Volgende stappen

Inkomend verkeer configureren