Aviation Weather API - Client-Side Approaches
Overview
This page demonstrates different client-side approaches to fetch METAR data from the Aviation Weather API, which has CORS restrictions.
1. CORS Proxy
Uses a public proxy server to bypass CORS restrictions. Good for testing, but not recommended for production.
Pros: Simple to implement
Cons: Relies on third-party service, potential privacy issues
2. Service Worker
Uses a service worker as a client-side proxy. Best for static deployments with HTTPS.
Pros: Self-contained, works in production with HTTPS
Cons: Requires HTTPS, more complex setup
3. Direct Fetch
Attempts to fetch directly from the API. Will fail due to CORS, but included for completeness.
Pros: Simplest approach
Cons: Blocked by CORS policy
CORS Proxy Approach
Aviation Weather Client
Service Worker Approach
Aviation Weather (Service Worker)
Direct Fetch Approach
Attempts to fetch directly from the API. Will fail due to CORS, but included for completeness.
Pros: Simplest approach
Cons: Blocked by CORS policy
Recommendations for Static Deployment
- Service Worker (Recommended): Best for production static sites deployed with HTTPS
- CORS Proxy: Good for development and testing, but not for production
- Alternative APIs: Consider using weather APIs that support CORS natively
- Serverless Functions: If your hosting platform supports them (Vercel, Netlify, etc.)
- Browser extensions: Can disable CORS for development only
Important Notes
- Service Workers require HTTPS in production (localhost works with HTTP)
- Public CORS proxies should not be used for production applications
- Some hosting platforms offer built-in solutions for CORS issues
- Browser extensions can disable CORS for development only