基于Zappa部署Django+React至AWS后页面刷新404问题求助

方案1：用Lambda@Edge实现CloudFront路径透明重写 #

• 部署一个Lambda@Edge函数，绑定到CloudFront的Origin Request触发阶段：
  • 函数核心逻辑：当用户请求/currentPath时，自动将请求路径改写为/stageName/currentPath转发给源站，但不对用户返回的响应做任何路径修改，浏览器地址栏始终保持myDomainName/currentPath。
  • 示例代码（Python）：

    def lambda_handler(event, context):
        request = event['Records'][0]['cf']['request']
        # 给请求路径添加stageName前缀
        request['uri'] = f'/stageName{request["uri"]}'
        return request
    

  • 注意：Lambda@Edge必须部署在us-east-1区域，且需要配置足够的IAM权限关联到CloudFront分发。

方案2：调整Django路由兼容带stageName的路径 #

• 修改Django主urls.py，同时处理正常前端路径和带stageName的路径，统一返回React的index.html：

  from django.views.generic import TemplateView
  from django.urls import path, include
  
  urlpatterns = [
      # 保留原有API路由
      path('api/', include('your_api.urls')),
      # 捕获带stageName的所有前端路径，返回React入口文件
      path('stageName/<path:unused_path>', TemplateView.as_view(template_name='index.html')),
      # 捕获所有非API的正常前端路径，返回React入口文件
      path('<path:unused_path>', TemplateView.as_view(template_name='index.html')),
  ]
  

  这样即使CloudFront重定向到带stageName的URL，React也能正常加载并解析路由。

方案3：优化Zappa与Django配置避免重定向触发 #

• 检查zappa_settings.json，确保domain和stage配置匹配你的域名和部署阶段：

  {
      "production": {
          "domain": "myDomainName",
          "stage": "stageName",
          "aws_region": "us-west-2",
          "django_settings": "your_project.settings"
      }
  }
  

• 更新Django的settings.py，将myDomainName加入ALLOWED_HOSTS，避免因主机头不匹配导致的重定向：

  ALLOWED_HOSTS = ['myDomainName', 'your-cloudfront-domain']
  

方案4：调整CloudFront缓存策略消除缓存影响 #

• 在CloudFront分发的行为设置中，修改缓存键配置：
  • 确保缓存键基于用户请求的原始路径（不带stageName）生成，避免缓存错误的重定向响应。
• 针对重定向响应（HTTP 3xx状态码）设置较短的TTL（比如1分钟），或者直接禁用缓存，减少首次错误后的影响范围。

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