"Firewall rules blocked me from connecting to one or more addresses (expand for details)"
The React application was making direct fetch() calls to external cryptocurrency APIs that can be blocked by:
- Corporate/institutional firewall rules
- Network security policies
- Geographic restrictions
- CORS policies
-
CoinGecko API (
https://api.coingecko.com/api/v3/simple/price?ids=litecoin&vs_currencies=usd)- Used by:
LitecoinPriceBotcomponent - Purpose: Fetch real-time Litecoin prices
- Used by:
-
Mempool.space API (
https://mempool.space/api/litecoin/txs/mempool)- Used by:
LitecoinMempoolTransactionscomponent - Purpose: Fetch Litecoin mempool transaction data
- Used by:
- Added 5-second timeout for API requests to prevent hanging
- Implemented
AbortControllerfor proper request cancellation and cleanup - Added graceful error handling that doesn't break the UI
- Console warnings for debugging while maintaining user experience
- LitecoinPriceBot: Falls back to cached/approximate price ($105.50)
- LitecoinMempoolTransactions: Falls back to sample transaction data
- Visual indicators (yellow background with warning icon) when using fallback data
- Users always know when they're seeing cached vs. live data
- Environment variable support:
VITE_COINGECKO_API_URLandVITE_MEMPOOL_API_URL - Allows users to configure custom proxies or alternative endpoints
- Created
.env.examplewith documentation and examples - Existing
.gitignorealready protects.env.localfrom being committed
Created NETWORK_TROUBLESHOOTING.md guide covering:
- Common symptoms and causes of connectivity issues
- Multiple solution approaches:
- Environment variable configuration
- CORS proxy setup (with security warnings)
- IT/firewall whitelisting requests
- Using fallback data (already implemented)
- Testing and debugging instructions
- Security considerations
- GitHub Codespaces specific guidance
Updated README.md:
- Added dedicated Network/Firewall Issues section
- Links to troubleshooting guide
- Notes about fallback data behavior
✅ Build: Successful
✓ built in 1.34s
dist/assets/index-6mDuv5hN.js 297.71 kB │ gzip: 99.97 kB
✅ Tests: All passing
Test Files 1 passed (1)
Tests 1 passed (1)
✅ Security: No vulnerabilities
CodeQL Analysis: 0 alerts found
✅ Code Review: Feedback addressed
- Fixed null/undefined check for price formatting
- Extracted MAX_TRANSACTIONS_DISPLAY constant
- App would fail silently or show error messages when APIs are blocked
- No way to configure alternative endpoints
- No guidance on resolving connectivity issues
- Poor user experience in restricted networks
- App continues to work with fallback data when APIs are blocked
- Clear visual indicators when using cached data
- Users can configure custom endpoints via environment variables
- Comprehensive troubleshooting documentation
- Professional error handling with console warnings for debugging
- src/LitecoinPriceBot.jsx - Enhanced with timeout, fallback, and env var support
- src/LitecoinMempoolTransactions.jsx - Enhanced with timeout, fallback, and env var support
- .env.example - New file documenting configuration options
- NETWORK_TROUBLESHOOTING.md - New comprehensive troubleshooting guide
- README.md - Updated with network/firewall troubleshooting section
All changes maintain security best practices:
- No hardcoded credentials or API keys
- Environment variables are properly gitignored
- Documentation includes warnings about public CORS proxies
- Recommends backend proxy solutions for production use
- Encourages compliance with organizational security policies
- Consider implementing a backend API proxy for production use
- Add retry logic with exponential backoff for transient failures
- Implement caching layer to reduce API dependency
- Add monitoring/logging for API failures
- Consider WebSocket connections for real-time data updates
The firewall connectivity issue has been resolved with a robust solution that:
- Handles blocked APIs gracefully
- Provides fallback functionality
- Offers configuration flexibility
- Includes comprehensive documentation
- Maintains security and code quality standards
The application now works reliably in restricted network environments while providing transparency about data freshness.