cloudfront-apigateway-s3-debug

Diagnose CloudFront routing misconfigurations returning S3 content for /api/* paths.

2|Updated May 10, 2026
One-click install
npx skills add https://github.com/freedomw1987/tree_monstor --skill cloudfront-apigateway-s3-debug
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: cloudfront-apigateway-s3-debug
Source: https://github.com/freedomw1987/tree_monstor/tree/main/skills/debugging/cloudfront-apigateway-s3-debug
Command: npx skills add https://github.com/freedomw1987/tree_monstor --skill cloudfront-apigateway-s3-debug

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill fixes the common issue where CloudFront returns S3 static HTML content, 403, or 404 errors for /api/* routes instead of the expected API Gateway responses, which breaks API access for full-stack applications hosted on AWS with S3 static frontends and API Gateway backends.

Core Features & Use Cases

  • Root Cause Diagnosis: Identifies common misrouting triggers including incorrect CloudFront cache behavior priority, missing API Gateway origin configurations, and use of internal ALB DNS names as CloudFront origins.
  • Step-by-Step Debug Workflow: Provides explicit test commands to confirm API Gateway functionality directly and through CloudFront, plus header checks to verify what content CloudFront is serving.
  • Multiple Fix Options: Offers three distinct resolution paths: adding a dedicated API Gateway cache behavior, switching API Gateway to regional endpoints, or bypassing CloudFront for API calls entirely.
  • Prevention Best Practices: Includes guidelines to avoid recurring routing errors during CloudFront distribution setup.

Quick Start

Use the cloudfront-apigateway-s3-debug skill to diagnose and resolve the issue where your CloudFront domain returns S3 static content instead of API Gateway responses for /api/* routes.

Frequently Asked Questions about cloudfront-apigateway-s3-debug

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
Why does CloudFront return S3 static content or 403 errors for /api/* routes instead of API Gateway responses?

CloudFront returns S3 content or 403 errors for /api/* routes due to misrouting issues like incorrect cache behavior priority, missing API Gateway origins, or using internal ALB DNS names. Fixing these CloudFront cache behavior configurations restores proper API Gateway routing.

How do I debug CloudFront routing issues between S3 and API Gateway?

Debug CloudFront routing by running test commands to confirm API Gateway functionality directly and through CloudFront, plus checking headers to verify what content CloudFront serves. This identifies whether cache behavior priority or origin configurations cause the misrouting.

What is the best way to fix CloudFront misrouting API calls to S3 content?

The best way to fix CloudFront misrouting is adding a dedicated API Gateway cache behavior, switching API Gateway to regional endpoints, or bypassing CloudFront for API calls entirely. These three resolution paths correct the /api/* path routing to API Gateway.

Does using an internal ALB DNS name as a CloudFront origin cause API routing errors?

Using an internal ALB DNS name as a CloudFront origin causes API routing errors because CloudFront cannot route to internal endpoints. Switching to a regional API Gateway endpoint or configuring a proper origin resolves the /api/* path misrouting.

How to prevent CloudFront from serving S3 static HTML instead of API Gateway responses?

Prevent CloudFront from serving S3 static HTML by applying best practices for cache behavior priority and dedicated API Gateway origins during distribution setup. These guidelines eliminate recurring routing errors for /api/* paths in AWS full-stack deployments.