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

Question

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

mydistribution.cloudfront.net/path1 --> 负载均衡器 A 服务 A

mydistribution.cloudfront.net/path2 --> 负载均衡器 B 服务于服务 B

mydistribution.cloudfront.net/frontend ---> 托管单页应用程序 JS/CSS/HTML 的 S3 存储桶，该应用程序对服务进行 AJAX 调用

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

例如（右侧的所有内容都已设置并在正确的端口上运行）

localhost:8080/path1 --> 运行 8091 的本地 Web 应用程序服务器

localhost:8080/path2 --> 端口 8090 上的本地 Web 应用程序服务器

localhost:8080/frontend --> 端口 8081 上的本地节点服务器，为 HTML/JS/CSS 提供服务

Answer 1

您正在寻找的是反向代理。nginx 将非常适合这一点。它相信它实际上是 CloudFront 在幕后使用的东西（尽管您也可以使用 Apache 实现相同的效果）。他们在这里解释了如何为一些基本的反向代理场景设置它：https : //www.nginx.com/resources/admin-guide/reverse-proxy/

就你可以用 NGINX 做的事情而言，这真的只是冰山一角。您可以完全控制入站和出站标头。这是一个非常强大的平台。

查看一些 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;
}