CORS 过滤器

跨域资源共享 (CORS) 是一种通过指定能够访问域的某些或所有路由的外部域来强制执行客户端对资源的访问控制的方法。浏览器使用 HTTP 标头的存在来确定是否允许来自不同来源的响应。

为了帮助演示前端 Envoy 如何强制执行 CORS 策略，我们发布了一组 docker compose 沙盒，它们在不同的来源上部署前端和后端服务，两者都在前端 Envoy 后面。

前端服务有一个字段用于输入后端服务的远程域，以及单选按钮用于选择远程域的 CORS 强制执行。CORS 强制执行选择是

  • 禁用：在请求的路由上禁用 CORS。这将导致客户端 CORS 错误，因为所需的标头（被视为有效的 CORS 请求）不存在。

  • 开放：在请求的路由上启用 CORS，但允许的来源设置为 *。这是一个非常宽松的策略，意味着来源可以从该端点请求数据。

  • 受限：在请求的路由上启用 CORS，并且唯一允许的来源是 envoyproxy.io。这将导致客户端 CORS 错误。

步骤 1：启动所有容器

更改到 examples/cors/frontend 目录，并启动容器

$ pwd
envoy/examples/cors/frontend
$ docker compose pull
$ docker compose up --build -d
$ docker compose ps

          Name                          Command              State                    Ports
-----------------------------------------------------------------------------------------------------------
frontend_front-envoy_1        /docker-entrypoint.sh /bin ... Up           10000/tcp, 0.0.0.0:8000->8000/tcp
frontend_frontend-service_1   python3 /code/service.py   ... Up (healthy)

现在，切换到 cors 示例中的 backend 目录，并启动容器

$ pwd
envoy/examples/cors/backend
$ docker compose pull
$ docker compose up --build -d
$ docker compose ps

          Name                         Command             State                            Ports
-----------------------------------------------------------------------------------------------------------------------------------
backend_backend-service_1   python3 /code/service.py   ... Up (healthy)
backend_front-envoy_1       /docker-entrypoint.sh /bin ... Up             10000/tcp, 0.0.0.0:8002->8000/tcp, 0.0.0.0:8003->8001/tcp

步骤 2：测试 Envoy 的 CORS 功能

您现在可以打开浏览器，在 https://127.0.0.1:8000 上查看您的前端服务。

跨域请求的结果将显示在页面上的“请求结果”下。

您的浏览器的 CORS 强制执行日志可以在浏览器控制台中找到。

例如

Access to XMLHttpRequest at 'http://192.168.99.100:8002/cors/disabled' from origin 'http://192.168.99.101:8000'
has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

步骤 3：通过 admin 检查后端的统计信息

当 Envoy 运行时，如果配置了端口，它可以监听 admin 请求。

在示例配置中，后端 admin 绑定到端口 8003。

如果您浏览到 https://127.0.0.1:8003/stats，您将能够查看后端的所有 Envoy 统计信息。您应该看到 CORS 统计信息（对于无效和有效来源）随着您从前端集群发出请求而增加。

http.ingress_http.cors.origin_invalid: 2
http.ingress_http.cors.origin_valid: 7

另请参阅

Envoy admin 快速入门指南

Envoy admin 界面的快速入门指南。