Turn your personal Google Drive into a free media CDN for images and videos.
Upload files, get instant public URLs, embed anywhere — no bandwidth limits from third-party tiers.
Demo • Why This Exists • Features • Quick Start • How It Works • Known Limitations • FAQ
Free media hosting tiers break projects. You've been there:
- Cloudinary hits its 25GB storage or 25GB bandwidth limit and your images 404.
- Imgur bans hotlinking from non-Imgur domains.
- Vercel Blob / Supabase Storage free tiers cap out fast for side projects.
- imgbb, PostImages — unreliable uptime, random key bans.
GDrive Media Hosting bypasses all of this. It uses Google's own storage (15GB free per account, expandable) and Google's own CDN delivery infrastructure — the same infrastructure that serves billions of Gmail attachments and Google Photos every day.
You own the files. They live in your Drive. No third party holds your media hostage.
| Feature | Description |
|---|---|
| 🖼️ Direct Image Hotlinks | Converts images to lh3.googleusercontent.com/d/FILE_ID — embeddable in any <img> tag, Markdown, or blog |
| 🎬 Video Embed Codes | Generates <iframe> embed codes for videos using Google Drive's built-in preview player |
| ⬆️ Multi-file Upload | Drag-and-drop or click-to-browse with real-time per-file progress tracking |
| 🔍 Instant Search | Filter your hosted files by name in real time |
| 🔃 Sort & Filter | Sort by newest, oldest, or filename — filter by All / Images / Videos tabs |
| ✏️ Rename Files | Rename files directly in the UI, synced back to your Drive |
| 🗑️ Bulk Delete | Multi-select files and delete them all in one click |
| 🔐 Client-Side Auth Only | OAuth 2.0 token flow — your tokens are stored in sessionStorage only and never touch any server |
| 🎉 Copy URL with Confetti | Because why not make it satisfying |
Visit the deployed app and connect your Google Account. No setup required.
The app uses a shared Google OAuth Client ID by default. If you hit quota limits from heavy use, follow Option 2 to use your own.
Prerequisites: Node.js 18+, a Google Cloud project
git clone https://github.com/Miftahul-Islam-Efaz/GDrive-Media-Hosting.git
cd GDrive-Media-Hosting
npm install- Go to Google Cloud Console
- Create a new project (or use an existing one)
- Navigate to APIs & Services → Credentials
- Click Create Credentials → OAuth 2.0 Client ID
- Select Web Application
- Add your domain to Authorized JavaScript Origins:
- For local development:
http://localhost:3000 - For production:
https://yourdomain.com
- For local development:
- Copy your Client ID
In Google Cloud Console → APIs & Services → Library → Search for Google Drive API → Enable it.
npm run devOpen http://localhost:3000, go to Settings, paste your Client ID, and reconnect.
npm run buildDeploy the .next output to Vercel, Netlify, Cloudflare Pages, or any static/Node host.
User → Connects Google Account (OAuth 2.0 Token Flow)
→ App requests drive.file scope (access only to files it creates)
→ On first connect, creates a "GDrive Media Host" folder in Drive
→ Uploads go directly to Google Drive via Drive API v3 (multipart upload)
→ Each file is automatically set to "Anyone with link → Viewer" permissions
→ Image URLs are served via Google's lh3.googleusercontent.com CDN
→ Video embeds use Google Drive's built-in preview iframe player
→ All tokens stored in browser sessionStorage only — cleared on tab close
No backend server. No database. No proxy. Every API call goes directly from your browser to Google's APIs.
<img src="https://lh3.googleusercontent.com/d/YOUR_FILE_ID" alt="My Image" /><iframe
src="https://drive.google.com/file/d/YOUR_FILE_ID/preview"
width="640"
height="480"
allow="autoplay"
></iframe>
⚠️ Videos cannot be embedded in native HTML5<video>tags due to CORS restrictions on Google Drive's streaming endpoints. Use the iframe embed method above.
Be honest with yourself about these before using this in production:
| Limitation | Details |
|---|---|
| Google Drive storage cap | Free accounts get 15GB. This is not "infinite" — plan accordingly or use a paid Google One plan. |
lh3 hotlinks are unofficial |
Google doesn't officially document the lh3.googleusercontent.com/d/ CDN URL format. It has worked reliably for years, but could change without notice. |
| Videos are iframe-only | CORS blocks native <video> tag streaming from Drive. Embeds only. |
| 15 min OAuth sessions | Google's token expires every ~60 minutes. The app auto-warns you and prompts a reconnect. |
| Not for high-traffic production assets | Google may throttle files that receive millions of requests per day from a personal account. Use Google Cloud CDN + Cloud Storage for that scale. |
| All files are public | Every file you upload is set to "Anyone with link can view." Do not upload private content. |
- The app requests only the
drive.filescope — it can only see and manage files it created itself. It cannot access your existing Google Drive files. - Your OAuth access token is stored in
sessionStorage(cleared when you close the tab) andlocalStoragefor configuration only (folder ID, preferences). - No token, no email, no file data is ever sent to any third-party server. All Drive API calls go directly from your browser to
googleapis.com. - This is a fully client-side application.
Q: Why does the image URL use lh3.googleusercontent.com instead of drive.google.com?
Drive's regular shareable links redirect through a viewer page. The lh3 endpoint serves the raw image bytes directly, making it usable as a hotlink in <img> tags without a redirect.
Q: Can I use this for my portfolio or blog images?
Yes. This is the primary use case. Just be aware of the unofficial nature of the lh3 URL format and keep backups of important images.
Q: Can I use this for video hosting at scale?
No. For high-traffic video serving, use Cloudflare Stream, Bunny.net, or Mux. This tool is for personal projects and side projects, not production video platforms.
Q: Will Google ever break this?
Possibly. The lh3 URL format has been stable for years, but it's not an officially supported API. If it breaks, the fallback is Google Drive's standard shareable viewer link.
Q: Is this free forever?
As long as you stay within your Google Drive storage quota (15GB free), yes. Google Drive storage has been free at 15GB since 2012.
GDrive-Media-Hosting/
├── src/
│ └── app/
│ ├── page.js # Main application (all UI + Drive API logic)
│ ├── layout.js # Next.js root layout
│ ├── globals.css # All styles (Google Drive-inspired light theme)
│ └── about/ # About page
├── next.config.mjs
├── package.json
└── README.md
Pull requests are welcome. For major changes, please open an issue first to discuss what you'd like to change.
- Fork the repo
- Create your feature branch (
git checkout -b feature/your-feature) - Commit your changes (
git commit -m 'feat: add your feature') - Push to the branch (
git push origin feature/your-feature) - Open a Pull Request
If GDrive Media Hosting saved your project from a broken Cloudinary quota or an Imgur ban, please star this repository. It costs nothing and helps other developers find this tool.
MIT — free to use, fork, and build on.
Built by Miftahul Islam Efaz — Autodidact Entrepreneur, Vibe-Coder & AI Orchestrator