如何在本地开发环境中模拟 aws cloudfront 多源

Question

Cloudfront 有一个很好的特性，允许不同的路径到达不同的来源。我们使用它来为从 S3 和 AJAX 服务到多个服务的纯客户端单页应用程序提供支持，简化示例设置为：

mydistribution.cloudfront.net/path1 --> load balancer A serving service A

mydistribution.cloudfront.net/path2 --> load balancer B serving service B

mydistribution.cloudfront.net/frontend ---> S3 bucket that hosts the single page app JS/CSS/HTML that makes AJAX calls to the services

我正在寻找一种方法来设置本地环境来模仿这部分行为，以便同一 url/port 上的不同本地路径可以解析为不同本地运行服务端口。重要的是，CORS 和其他跨域问题不会影响本地开发，因为所有事情都发生在同一个 domain/port 中，因此在非本地设置中不存在。如何最好地实现这一目标？

例如（右边的所有东西都已经设置好并且运行在右边的端口上）

localhost:8080/path1 --> A local web application server running 8091

localhost:8080/path2 --> A local web application server on port 8090

localhost:8080/frontend --> A local node server on port 8081 serving the HTML/JS/CSS

Answer 1

您要找的是 reverse-proxy。 nginx 非常适合这个。它相信它实际上是 CloudFront 在幕后使用的东西（尽管您也可以使用 Apache 实现相同的目的）。他们在这里解释了 set-it 如何应对一些基本的 reverse-proxy 场景：https://www.nginx.com/resources/admin-guide/reverse-proxy/

这只是您使用 NGINX 可以做的事情的冰山一角。您可以完全控制入站和出站 headers。这是一个非常强大的平台。

查看一些 nginx 配置示例：

location /path1/ {
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_pass http://localhost:8091;
}

location /path2/ {
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_pass http://localhost:8090;
}

location /frontend/ {
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_pass http://localhost:8081;
}

如何在本地开发环境中模拟 aws cloudfront 多源

How to simulate aws cloudfront multiple origins in a local developer environment

ajax

cors

localhost

amazon-cloudfront