AWS架构下WordPress与Next.js同域名部署方案咨询

以下是三种落地性较强的架构方案，可根据团队技术栈、预算和运维复杂度选择：

方案一：CloudFront 作为统一入口（推荐，适合全球访问优化） #

核心组件 #

CloudFront 分发、Lightsail WordPress 实例、EC2 Next.js（Nginx代理）实例、AWS Certificate Manager（ACM）、Route 53（若域名托管在AWS）

配置步骤 #

1. CloudFront 源配置

   • 创建CloudFront分发，默认源指向Lightsail WordPress的公网IP或内部域名（需确保WordPress允许CloudFront的反向代理请求，可在wp-config.php中添加$_SERVER['HTTPS'] = 'on';并信任X-Forwarded-For头）
   • 添加第二个自定义源，指向EC2 Next.js实例的公网IP（或Nginx监听的443端口）

2. 路由规则配置

   • 默认行为（路径*）：绑定WordPress源，处理首页及未指定的页面
   • 添加自定义行为，路径设为/abc/*（可根据实际需求调整），绑定Next.js源，按需开启缓存策略（针对Next.js静态内容）

3. SSL 与域名解析

   • 在ACM中申请somedomain.com的SSL证书（需选择CloudFront支持的区域，如us-east-1），关联到CloudFront分发
   • 更新Route 53的A/AAAA记录，将somedomain.com指向CloudFront分发的域名

4. 应用侧调整

   • 修改WordPress站点URL为https://somedomain.com，确保内部链接、媒体资源路径正确
   • 在Next.js的next.config.js中设置basePath: '/abc'，保证静态资源和路由不出现路径错误

方案二：应用负载均衡（ALB）作为统一入口（适合VPC内资源整合） #

核心组件 #

ALB、Lightsail WordPress实例、EC2 Next.js实例、ACM、Route 53

配置步骤 #

1. VPC 连通性处理

   • 若Lightsail实例和EC2实例不在同一VPC，需配置Lightsail VPC与EC2所在VPC的对等连接，确保ALB能访问到Lightsail实例

2. ALB 与目标组配置

   • 创建HTTPS监听的ALB，关联ACM的somedomain.com证书
   • 创建两个目标组：
     • 目标组1：注册Lightsail WordPress实例，健康检查路径设为/
     • 目标组2：注册EC2 Next.js实例，健康检查路径设为/abc（或Next.js的健康检查接口）

3. 路由规则配置

   • ALB默认规则：将所有流量转发到WordPress目标组
   • 添加自定义规则：路径匹配/abc/*，转发到Next.js目标组

4. 域名解析与应用调整

   • 更新Route 53记录，将somedomain.com指向ALB的DNS名称
   • 同方案一，调整WordPress和Next.js的站点URL与路径配置

方案三：独立Nginx反向代理（适合小型团队、低预算场景） #

核心组件 #

新增EC2实例（部署Nginx）、Lightsail WordPress、原EC2 Next.js、SSL证书（ACM或Let's Encrypt）

配置步骤 #

1. Nginx 代理配置

   • 在新增EC2实例上安装Nginx，配置SSL证书（推荐用ACM导出证书或Let's Encrypt自动签发）
   • 修改Nginx站点配置文件（如/etc/nginx/sites-available/somedomain.conf），添加反向代理规则：

     server {
         listen 443 ssl;
         server_name somedomain.com;
     
         ssl_certificate /path/to/fullchain.pem;
         ssl_certificate_key /path/to/privkey.pem;
     
         # 转发首页及默认路径到WordPress
         location / {
             proxy_pass https://[your-lightsail-wordpress-ip];
             proxy_set_header Host $host;
             proxy_set_header X-Real-IP $remote_addr;
             proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
             proxy_set_header X-Forwarded-Proto $scheme;
         }
     
         # 转发/abc路径到Next.js
         location /abc/ {
             proxy_pass https://[your-ec2-nextjs-ip]/;
             proxy_set_header Host $host;
             proxy_set_header X-Real-IP $remote_addr;
             proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
             proxy_set_header X-Forwarded-Proto $scheme;
         }
     }
     

2. 域名解析与应用调整

   • 更新Route 53将somedomain.com指向这个Nginx实例的公网IP
   • 调整WordPress和Next.js的配置，允许来自Nginx的反向代理请求

通用注意事项 #

• 安全组配置：所有后端实例（WordPress、Next.js）仅允许来自CloudFront/ALB/Nginx的流量，禁止直接暴露公网
• SEO优化：确保Next.js页面的meta标签、结构化数据正确，WordPress保持原有SEO配置；CloudFront/ALB可配置缓存规则，加速静态内容同时不影响动态页面的爬虫抓取
• 监控：启用CloudWatch监控入口组件的流量、错误日志，及时排查路由或应用问题

内容的提问来源于stack exchange，提问作者Jimi H