A secure, zero-vulnerability file transfer solution built on modern Cloudflare infrastructure. Features enterprise-grade security, zero npm audit issues, and modern UI/UX with 100% Cloudflare-native architecture.
- 🛡️ Zero Vulnerabilities - 0 npm audit issues, all legacy dependencies removed
- 🔒 Modern Security Stack - 100% Cloudflare-native with Web Crypto API
- ⚡ Ultra-Fast Performance - ~400ms dev startup, ~1s builds
- 📦 Native R2 Storage - Direct Cloudflare R2 bindings with multipart upload
- 🛡️ Bot Protection - Cloudflare Turnstile human verification
- 🚀 Chunked Upload - Large files (>80MB) use optimized multipart upload
- 📱 Mobile-First Design - Responsive UI that works everywhere
- 🎯 Smart Expiration - Files automatically deleted after expiration
- 🔐 Password Protection - Web Crypto API hashed passwords
- 📊 Download Limits - Configurable download count restrictions
- 🧹 Auto Cleanup - Scheduled worker removes expired files
- 🔍 TypeScript - Full type safety and modern development
- Cloudflare Account with Pages and Workers enabled
- Node.js 18+ and npm
- Wrangler CLI
git clone https://github.com/TheMarketingCompany/TMC-File-Transfer.git
cd TMC-File-Transfer
npm install# Install Wrangler CLI if not already installed
npm install -g wrangler
# Login to Cloudflare
wrangler login
# Create D1 database
wrangler d1 create tmc-file-transfer
# Copy the database_id from output
# Create R2 bucket
wrangler r2 bucket create tmc-transfers# Copy example configurations
cp example.wrangler.toml wrangler.toml
cp .env.example .env
# Update wrangler.toml with your values:
# - Replace placeholders with your actual Cloudflare resource IDs
# - Update domain names and Turnstile keys
# - Generate secure tokens for MIGRATION_AUTH_TOKEN and CLEANUP_SECRET
# Update .env with your values:
# - CF_WAF_API_TOKEN: Your Cloudflare API token (for WAF deployment)
# - CF_WAF_ZONE_ID: Your Cloudflare Zone ID
# - VITE_* variables: Your company information for footer
# Generate secure tokens
openssl rand -hex 32 # Use for MIGRATION_AUTH_TOKEN
openssl rand -hex 32 # Use for CLEANUP_SECRET# Build the application
npm run build
# Deploy complete application (Pages + WAF + Cleanup Worker)
npm run deploy
# Note the deployment URL from output
# Run database migrations
curl -X POST https://your-deployment-url.pages.dev/api/db/migrate \
-H "Authorization: Bearer your-secret-token"Why full deployment is essential:
- 🛡️ WAF Rules: Required for upload protection and DDoS prevention
- 🧹 Cleanup Worker: Essential to prevent expensive R2 storage accumulation
- 📱 Pages: The frontend application itself
Individual deployment commands (if needed):
# Deploy only Pages (frontend)
npm run deploy:pages
# Deploy only WAF rules
npm run deploy:waf
# Deploy only cleanup worker
npm run deploy:cleanup- Vue 3.4.32 - Latest Composition API with TypeScript
- Material Web 2.3.0 - Material Design 3 web components
- Custom utility CSS - Lightweight utility classes with Material Design tokens
- Vite 7.x - Lightning-fast build tool
- TypeScript 5.5.3 - Full type safety
- Cloudflare Pages Functions - Serverless TypeScript functions
- Cloudflare D1 - SQLite with prepared statements
- Cloudflare R2 - Object storage with native multipart upload
- Web Crypto API - Native browser cryptography
- Fetch API - Native HTTP requests (no axios)
- Wrangler 4.x - Latest deployment tools
- 0 npm vulnerabilities - All legacy packages removed
- Native APIs only - No third-party crypto or HTTP libraries
- Select File: Drag & drop or click to browse
- Configure Options:
- Set expiration (1 day, 1 week, 1 month)
- Add password protection (optional)
- Set download limits
- Upload: Click upload and get shareable link
- Share: Copy the generated secure link
- Access: Use the shared link or enter file ID
- Authenticate: Enter password if required
- Download: File downloads immediately
- Auto-Cleanup: Files expire automatically
- ✅ 0 npm audit vulnerabilities (eliminated all 16 previous issues)
- ✅ No AWS SDK dependencies (replaced with native Cloudflare R2)
- ✅ No axios dependency (replaced with native Fetch API)
- ✅ No legacy crypto libraries (replaced with Web Crypto API)
- ✅ No third-party clipboard libraries (replaced with Clipboard API)
- File Validation: Comprehensive MIME type and size checking
- Bot Protection: Cloudflare Turnstile verification for uploads
- Password Protection: Web Crypto API SHA-256 with unique salts
- Secure Headers: CSP, HSTS, XSS protection, CSRF prevention
- Input Sanitization: All inputs validated with TypeScript types
- SQL Injection Prevention: D1 prepared statements only
- Auto Expiration: Automatic file cleanup with scheduled workers
- Edge Caching: Static assets cached globally
- Database Optimization: Indexed queries and batch operations
- Lazy Loading: Components loaded on demand
- Compression: Gzip/Brotli compression enabled
- CDN Delivery: Files served from nearest edge
Restrict file uploads to authorized users while keeping downloads public:
📋 Complete Zero Trust Setup Guide →
Quick Overview:
- ✅ Uploads: Only authenticated users
- ✅ Downloads: Public (anyone with link)
- ✅ Easy user management via Cloudflare dashboard
- ✅ Works with existing Turnstile bot protection
- ✅ Free plan supports up to 50 users
[env.production.vars]
ENVIRONMENT = "production"
MAX_FILE_SIZE = "5368709120" # 5GB (configurable)
ALLOWED_ORIGINS = "https://yourdomain.com"
[env.development.vars]
ENVIRONMENT = "development"
MAX_FILE_SIZE = "5368709120" # 5GB (configurable)
ALLOWED_ORIGINS = "*"Turnstile keys are configured in wrangler.toml:
# Production keys
TURNSTILE_SITE_KEY = "your_turnstile_site_key_here"
TURNSTILE_SECRET_KEY = "your_turnstile_secret_key_here"
# Test keys for preview
TURNSTILE_SITE_KEY = "1x00000000000000000000AA"
TURNSTILE_SECRET_KEY = "1x0000000000000000000000000000000AA"No file type restrictions - all file types are supported with comprehensive security validation in src/utils/security.ts.
- File upload/download activities (console logs)
- Error tracking and debugging information
- Bot protection verification results
- Database operation logs
- Cleanup worker execution statistics
- Deployment and configuration logs
Real-time monitoring available in your Cloudflare dashboard:
- Workers Analytics - API endpoint performance, error rates, CPU usage
- Pages Analytics - Frontend traffic, visitor statistics, geographic data
- R2 Usage Statistics - Storage usage, bandwidth, request counts
- D1 Query Performance - Database query times, connection statistics
- Turnstile Analytics - Bot protection effectiveness, challenge rates
- WAF Analytics - Security rule triggers, blocked requests
Access Analytics:
- Go to your Cloudflare dashboard
- Select your domain/project
- Navigate to Analytics & Logs section
- View real-time and historical data
Key Metrics to Monitor:
- Upload/download success rates
- Average file processing times
- Bot protection challenge rates
- Storage usage trends
- API error rates by endpoint
# Start development server
npm run dev
# Run with local Cloudflare bindings
npx wrangler pages dev distnpm run dev # Development server (~400ms startup)
npm run build # Fast production build (~1s)
npm run build:check # Build with TypeScript checking
npm run typecheck # TypeScript validation only
npm run preview # Preview build locally# Run migrations
curl -X POST http://localhost:8788/api/db/migrate
# Query database locally
npx wrangler d1 execute tmc-file-transfer --command "SELECT * FROM uploads_v2 LIMIT 10""Database not found" error:
- Ensure D1 database is created and ID is correct in wrangler.toml
- Run migrations:
POST /api/db/migrate
"R2 bucket not found" error:
- Verify bucket exists:
wrangler r2 bucket list - Check bucket name in wrangler.toml
Files not uploading:
- Check file size (configurable limit, default 5GB)
- Verify file type is allowed
- Check Turnstile bot protection is working
Turnstile not working:
- Verify site and secret keys in
wrangler.toml - Check domain configuration in Cloudflare dashboard
Enable debug logging by setting:
console.log('Debug info:', debugData);For technical issues:
- Review Cloudflare Workers logs
- Open an issue with detailed error information
- Bot Protection: Configure Turnstile sensitivity in Cloudflare dashboard
- Database: D1 supports horizontal scaling
- Storage: R2 scales automatically
- CDN: Cloudflare edge handles traffic spikes
- Authentication: Add OAuth integration
- Audit Logging: Implement comprehensive logging
- Encryption: Add client-side encryption
- Compliance: GDPR/SOC2 compliance features
- Security Monitoring:
npm audit(currently 0 vulnerabilities) - Dependency Updates:
npm updatewith security focus - Cleanup Monitoring: Verify expired files are deleted
- Performance Review: Check analytics monthly
- Build Performance: Monitor ~1s build times
- Database: D1 automatic backups
- Files: R2 versioning available
- Configuration: Version control (this repo)
Special thanks to contributors:
- Fork the repository
- Create feature branch:
git checkout -b feature-name - Commit changes:
git commit -am 'Add feature' - Push to branch:
git push origin feature-name - Create Pull Request
graph TB
User[👤 User] --> CF[🌐 Cloudflare Edge]
CF --> Pages[📄 Pages]
CF --> Functions[⚡ Functions]
Functions --> D1[(🗄️ D1 Database)]
Functions --> R2[(📦 R2 Storage)]
Worker[🔧 Cleanup Worker] --> D1
Worker --> R2
- Upload: File → Validation → R2 Storage → D1 Metadata
- Download: Request → D1 Lookup → R2 Retrieval → User
- Cleanup: Worker → D1 Query → R2 Deletion → D1 Update
This project is licensed under the GNU General Public License v3.0.
- Issues: GitHub Issues
- Security: Contact through GitHub Issues for responsible disclosure
- General: Contact through GitHub
| Document | Description |
|---|---|
| TROUBLESHOOTING.md | Common issues and solutions |
| ZERO_TRUST_SETUP.md | Zero Trust authentication setup |
| CLAUDE.md | Technical architecture overview |
Built with ❤️ using Cloudflare's edge platform