When a client from one domain accesses a service in a different domain or a service that resides in the same domain but uses a different port from the client, the client initiates a cross-origin request. If the service disallows cross-origin resource access, the client cannot access the service. In this case, you can implement cross-origin resource sharing (CORS) to allow web application servers to access cross-origin resources. This topic describes how to configure a CORS policy in a virtual service of Alibaba Cloud Service Mesh (ASM) to implement CORS.

CORS overview

For security reasons, browsers restrict cross-origin HTTP requests that are initiated from scripts. For example, XMLHttpRequest and the Fetch API follow the same-origin policy. This means that a web application that uses these APIs can request only resources from the same origin in which the application is loaded unless the response from other origins includes valid CORS headers.

CORS is a mechanism based on HTTP headers and allows a server to identify domains, schemes, or ports other than its own from which a browser permits loading resources.

The CORS mechanism supports two types of requests: simple requests and preflight requests.
  • Simple request mode:

    A browser sends a cross-origin request. The Origin header is specified in the request, which indicates that the request is a cross-origin request. After the destination server receives the cross-origin request, the server determines whether to allow the request based on configured CORS rules. In response, the server returns the Access-Control-Allow-Origin and Access-Control-Allow-Methods headers to indicate whether the request is allowed.

  • Preflight request mode:

    A browser sends a preflight request, which is an HTTP OPTIONS request. The request is used to check whether the destination server allows cross-origin requests from the current domain. If the destination server allows cross-origin requests from the current domain, the browser sends an actual cross-origin request.

    The OPTIONS request contains the following headers: Origin, Access-Control-Request-Method, and Access-Control-Request-Headers. After the destination server receives the OPTIONS request, the server specifies the Access-Control-Allow-Origin, Access-Control-Allow-Method, Access-Control-Allow-Headers, and Access-Control-Max-Age headers in the response to indicate whether the request is allowed. If the preflight request is allowed, the browser sends an actual cross-origin request.

If a request meets the following three requirements, the CORS mechanism processes the request as a simple request. Otherwise, the CORS mechanism processes the request as a preflight request.
  • The request uses one of the following methods:

    GET, HEAD, and POST

  • The Content-Type header in the request is set to one of the following values:

    ext/plain, application/x-www-form-urlencoded, and multipart/form-data

  • The request uses one of the following CORS-safelisted headers that are defined by the Fetch standard:

    Accept, Accept-Language, Content-Language, and Content-Type. Note: The value of the Content-Type header must be set to one of the values that are listed in the second requirement.

Configure a CORS policy in a virtual service

Browsers automatically implement CORS communication. To allow cross-origin requests that are initiated to a service and implement CORS communication, you must set the corsPolicy field in the virtual service that is defined for the service.
apiVersion: networking.istio.io/v1alpha3
kind: VirtualService
metadata:
  name: ratings-route
spec:
  hosts:
  - ratings.prod.svc.cluster.local
  http:
  - route:
    - destination:
        host: ratings.prod.svc.cluster.local
        subset: v1
    corsPolicy:
      allowOrigins:
      - exact: https://example.com
#     - regex: *     # You can use regular expressions to specify the addresses of the origins.
      allowMethods:
      - POST
      - GET
      allowCredentials: false
      allowHeaders:
      - X-Foo-Bar
      maxAge: "24h"
Parameter Description
allowOrigins The addresses of the origins that are allowed to access the service. Regular expressions are supported. For requests without credentials, the server can set this parameter to a wildcard (*) so that all origins are allowed to access the service.
allowMethods The HTTP methods that can be used to initiate cross-origin requests.
allowHeaders The headers that can be contained to initiate cross-origin requests. The headers are used to precheck the responses to requests.
exposeHeaders The whitelist of headers that the server allows browsers to access.
maxAge The maximum amount of time that browsers can cache the response to a preflight request.
allowCredentials Specifies whether credentials are required to initiate cross-origin requests. Only valid credentials can be used to initiate cross-origin requests.