Skip to content

fix: add WAF rule for CORS preflight OPTIONS requests#41

Merged
takaokouji merged 1 commit intomainfrom
fix-cors-preflight-options
Jan 18, 2026
Merged

fix: add WAF rule for CORS preflight OPTIONS requests#41
takaokouji merged 1 commit intomainfrom
fix-cors-preflight-options

Conversation

@takaokouji
Copy link
Contributor

Summary

ChromebookでmeshV2に接続する際のCORSエラーを修正しました。WAFにpreflight OPTIONSリクエスト用のルールを追加しています。

Changes

WAF Rule Addition (infra/mesh-v2/lib/mesh-v2-stack.ts)

  1. AllowPreflightOptions (priority: 0) - NEW

    • HTTPメソッド: OPTIONS
    • Origin: https://smalruby.app または https://smalruby.jp
    • Action: Allow
    • Purpose: CORS preflight リクエストを許可し、AppSyncがCORSヘッダーを返せるようにする
  2. AllowSpecificOrigins (priority: 1) - UPDATED

    • SingleHeader property: nameName (CloudFormation仕様に準拠)
    • その他の動作は変更なし

Implementation Details

Fixed Issues

  • SingleHeader プロパティ名を Name に修正(CloudFormation仕様)
  • TextTransformationTypeNONE に変更(メソッドマッチング用)

WAF Rule Behavior

Origin Method WAF Action Result
https://smalruby.app OPTIONS Allow (Rule 0) 200 + CORS headers
https://smalruby.app POST Allow (Rule 1) 200 + data
https://example.com OPTIONS Allow (Rule 0) 403 (blocked by default)
https://example.com POST Block (default) 403

Note: AppSyncはOPTIONSリクエストに対して access-control-allow-origin: * を返しますが、実際のPOSTリクエストはWAFでOriginチェックされます。

Test Results (stg2 environment)

preflight OPTIONS from https://smalruby.app

curl -X OPTIONS https://stg2.graphql.api.smalruby.app/graphql \
  -H "Origin: https://smalruby.app"
# → 200 + CORS headers

POST request from https://smalruby.app

curl -X POST https://stg2.graphql.api.smalruby.app/graphql \
  -H "Origin: https://smalruby.app" \
  -H "x-api-key: ..."
# → 200 + {"data":{"__typename":"Query"}}

POST request from unauthorized origin

curl -X POST https://stg2.graphql.api.smalruby.app/graphql \
  -H "Origin: https://example.com" \
  -H "x-api-key: ..."
# → 403 (blocked by WAF)

Deployment

この変更は本番環境 (prod) のみに適用されます(if (stage === 'prod'))。

Deployment Command

cd infra/mesh-v2
npx cdk deploy --context stage=prod

Post-Deployment Verification

# Test preflight OPTIONS
curl -X OPTIONS https://graphql.api.smalruby.app/graphql \
  -H "Origin: https://smalruby.app" \
  -H "Access-Control-Request-Method: POST" \
  -H "Access-Control-Request-Headers: content-type, x-api-key" \
  -v

# Expected: HTTP/2 200 + CORS headers

Related Issue

Fixes #30

🤖 Generated with Claude Code

- Added AllowPreflightOptions rule (priority: 0) to allow OPTIONS requests
- Fixed SingleHeader property name (name → Name)
- Fixed TextTransformationType (UPPERCASE → NONE for method matching)
- Ensures AppSync can return CORS headers for preflight requests

This fixes the CORS error reported on Chromebook when connecting to
production mesh v2 API (https://graphql.api.smalruby.app/graphql).

WAF rules now properly handle:
1. Preflight OPTIONS requests from allowed origins (priority 0)
2. Regular POST requests from allowed origins (priority 1)
3. Block all other requests (default action)

Tested on stg2 environment:
- OPTIONS from https://smalruby.app → 200 + CORS headers ✅
- POST from https://smalruby.app → 200 + data ✅
- POST from https://example.com → 403 (blocked) ✅

Fixes #30

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@takaokouji takaokouji merged commit 560a20a into main Jan 18, 2026
3 checks passed
@takaokouji takaokouji deleted the fix-cors-preflight-options branch January 18, 2026 15:26
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant