A self-hosted OneDrive file browser. Browse, preview, share, and download files from your OneDrive through a clean web interface — built with Next.js and designed to deploy on Vercel.
Demo: 2drv.vercel.app
- Browse OneDrive folders in grid or list view
- Preview images, video, audio, PDFs, Office docs, EPUBs, Markdown, code, and plain text
- Sort by name, size, or date (folders always come first)
- Filter by file type or extension
- Search across your OneDrive with Ctrl+K
- Download files with the original filename preserved
- Select multiple files and download as a ZIP
- Upload files and folders from the browser (optional, password-protected)
- Password-protect specific folders
- Multi-language UI (English, Vietnamese, German, Spanish, Hindi, Indonesian, Turkish)
- Dark mode
Go to Azure Portal > App registrations and register a new application.
- Set the redirect URI to
http://localhost - Add delegated permissions:
User.Read,Files.ReadWrite.All,offline_access - Create a client secret and note the Application (client) ID and secret value
If you only need read-only access,
Files.Read.Allworks instead ofFiles.ReadWrite.All.
Pick the setup that fits your needs. You will be prompted for environment variables during setup.
Read-only (browse, preview, download):
Read-only with protected folders:
Read/write with uploads:
Everything (uploads + protected folders + contact email):
After the first deploy, go to your Vercel project dashboard, open Storage, and connect an Upstash Redis database. The REDIS_URL variable will be injected automatically. Then redeploy.
Open your deployed URL. You will see a 3-step OAuth wizard — follow it to authorise your Microsoft account. Once done, the site will start showing your files.
| Variable | Description | Example |
|---|---|---|
NEXT_PUBLIC_SITE_TITLE |
Site title in the browser tab and navbar | My Drive |
USER_PRINCIPAL_NAME |
Your Microsoft account email | user@outlook.com |
BASE_DIRECTORY |
Which OneDrive folder to show. / means the root. |
/ or /Documents |
CLIENT_ID |
Azure App Registration client ID | xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx |
CLIENT_SECRET |
Azure client secret. The OAuth wizard encrypts this for you automatically. | (paste raw value in wizard) |
REDIS_URL |
Redis connection string. Auto-injected by Upstash after connecting. | redis://default:xxx@host:port |
| Variable | Description | Default |
|---|---|---|
NEXT_PUBLIC_PROTECTED_ROUTES |
Comma-separated folder paths that require a password. Each folder needs a .password file inside it on OneDrive. |
(none) |
NEXT_PUBLIC_EMAIL |
Contact email shown in the navbar | (none) |
UPLOAD_PASSWORD |
Password required for all upload and delete actions. Uploads are disabled if this is not set. | (none) |
UPLOAD_CONFLICT_BEHAVIOR |
What to do when uploading a file that already exists: rename, replace, or fail |
rename |
KV_PREFIX |
Redis key prefix, useful when multiple deployments share one Redis instance | (none) |
Important: Never prefix secrets (
CLIENT_SECRET,UPLOAD_PASSWORD,REDIS_URL) withNEXT_PUBLIC_. Variables with that prefix are exposed in the browser.
After deploying and connecting Redis, open your site. You should see a setup wizard that walks you through authorising your Microsoft account in three steps:
- The site shows you a link to get an authorisation code from Microsoft.
- You paste the code back into the site.
- The site exchanges the code for access and refresh tokens and stores them in Redis.
Once this is done, the site will display your OneDrive files. Tokens are refreshed automatically — you should not need to redo this unless you clear Redis or change the CLIENT_SECRET.
Site shows a blank page or errors after deploy
Make sure all required environment variables are set, then redeploy. Missing CLIENT_ID or CLIENT_SECRET is the most common cause.
Changed environment variables but nothing happened You need to redeploy after changing environment variables. Vercel does not pick up changes until the next build.
OAuth wizard does not appear
Check that REDIS_URL is set and working. The wizard requires a valid Redis connection to store tokens.
Files do not show up
Verify that BASE_DIRECTORY matches an actual folder path in your OneDrive. / shows the root. Make sure USER_PRINCIPAL_NAME is the correct Microsoft account email.
Upload says permission denied
Ensure your Azure App has Files.ReadWrite.All permission (not just Files.Read.All). After changing permissions, clear the stored tokens in Redis and re-authenticate.
Folder upload not working in the browser
Folder upload requires a Chromium-based browser for the webkitdirectory API.
Based on spencerwooo/onedrive-vercel-index, with modifications for Vercel deployment, server-side token storage, uploads, and security improvements.