ajax - 如何在本地开发人员环境中模拟 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/端口上的不同本地路径可以解析为不同端口上不同的本地运行服务。重要的是，CORS 和其他跨域问题不会影响本地开发，因为所有事情都发生在同一个域/端口上，因此非本地设置中不存在这些问题。如何最好地做到这一点？

例如(右边的所有东西都已经设置好并在正确的端口上运行)

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 servingthe HTML/JS/CSS

Answer 1

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

就您可以使用 NGINX 做些什么而言，这只是冰山一角。您可以完全控制入站和出站 header 。这是一个非常强大的平台。

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