kiến thức Onedrive Index (Web UI cho onedrive)

Vậy bác xem lại video là H265 rồi
xjIzSG9.png
Có cái nào support H265 không bác
 
sao mình làm như hướng dẫn chạy thử file thì không được nhỉ màn hình đen xì không có chạy,thử trên điện thoại thì nplayer với vlc hoạt động bình thường

1651886130014.png
 
A/ Giới thiệu:
onedrive-vercel-index là một Web UI cho onedrive, dùng để xem các file trong onedrive dưới dạng web tương tự như thế này https://drive.swo.moe/

Với những tính năng:
  • Direct link tất cả các file trong onedrive.
  • Xem trực tiếp tất cả các file video, nhạc, ảnh, ebook, pdf, office...
  • Có preview ảnh, video, pdf...
  • Tải nhiều file/thư một cùng lúc.
  • Có nút phát video thông qua VLC, Potplayer...
  • Có dark mode.
  • Các tính năng trên đều tương thích với điện thoại, tv...
  • Không cần tốn công đăng nhập khi vào trên thiết bị khác.
  • Hoàn toàn miễn phí.
B/ Chuẩn bị:
Tài khoản onedrive: Nếu là tài khoản edu, E5 (dev), office 365 family... thì phải có tài khoản quyền admin của cái nhóm ấy, hoặc quen biết với admin của nhóm ấy nhờ họ giúp, kéo xuống mục E đăng nhập để xem thêm.
Tài khoản E5 thì hoàn toàn miễn phí, lại có sẵn luôn quyền admin, có thể tham khảo thread này:
https://voz.vn/t/dang-ky-microsoft-...gay-tu-dong-gia-han-khi-con-kich-hoat.407602/
Đăng ký tài khoản của 3 site này nếu chưa có:
https://github.com
https://vercel.com/signup (Nên login bằng acc github cho tiện lợi sau này)
https://console.upstash.com/login (Nên login bằng acc github cho tiện lợi sau này)
Fork lại project này trên github
https://github.com/spencerwooo/onedrive-vercel-index

C/ Cài đặt trên github: (Bước này để cá nhân hóa, nếu như thích để mặc định thì bỏ qua)
Vào project đã fork > Vào folder Config > site.config.js > bấm vào đây để edit file

Bây giờ chỉnh sửa file config này theo ý thích từng dòng sau, t chỉ hướng dẫn mấy cái nào cơ bản thôi, cái nào ko cần thiết quá thì đọc phần note englisk để tìm hiểu thêm:
title: "Spencer's OneDrive" Là tên website ở góc trái trên cùng vd: title: "Fioren",
NHvXLgO.png

baseDirectory: '/', Là folder trong onedrive để đưa lên Web UI, nếu muốn đưa tất cả trong tài khoản thì giữ nguyên, không thì thêm vào vd như /FolderA/FolderB. Lưu ý phải là đường dẫn tới folder đã có sẵn trong onedrive, folder không nên có dấu tiếng việt, khoảng cách, kí tự đặc biệt...
footer: 'Powered by <a href="https://github.com/spencerwooo/onedrive-vercel-index" target="_blank" .... Dòng này là để quảng cáo, xóa đi cho đỡ tốn chỗ. bằng cách xóa toàn bộ 2 dòng này.
protectedRoutes: ['/Private folder/u-need-a-password', '/Some test files/Protected route'], Dùng để đặt password cho folder. VD: Folder cần đặt pass là: /My => code là
Code:
"protectedRoutes": [
  '/My',
],
Sau đó vào notepad tạo 1 file tên là .password nội dung là cái password cần đặt (lưu ý password 6 ký tự trở lên), sau đó upload vào trong cái folder My trên onedrive
email: 'mailto:[email protected]', xóa đi cho đỡ tốn chỗ sửa thành email: '',
datetimeFormat: 'YYYY-MM-DD HH:mm:ss', sửa thành datetimeFormat: 'DD-MM-YYYY HH:mm:ss', cho hợp vào định dạng thời gian ở VN
Sau khi sửa xong, kéo xuống dưới bấm nút Commit changes
D/ Deploy:
1/ Vercel (Phần 1):

Vào https://vercel.com/new
Bấm Add github account, trình duyệt sẽ mở ra 1 tab popup xác nhận của github có muốn cài đặt app của Vercel, bấm Install.

Sau khi add xong, nó sẽ hiện ra cái project vừa fork lại ở bước chuẩn bị. Chọn nó rồi bấm Import.
Nó sẽ chuyển sang bảng khác, vào mục Build and Output Settings
  • Build Command chọn Override đổi giá trị thành pnpm build
  • Install Command chọn Override đổi giá trị thành pnpm install
Mục Environment Variables tạo giá trị với
  • Name: NEXT_PUBLIC_USER_PRINCIPLE_NAME
  • Value: địa chỉ email của onedrive. Vd [email protected]. Sau đó bấm nút Add

Chỉnh xong nhấn nút Deploy và ngồi chờ đến khi nó báo thành công.
2/ Upstash:
Vào https://console.upstash.com/
Bấm Create database
  • Name: Tùy thích
  • Type: Chọn Regional, sau đó chọn vùng tùy theo nơi sinh sống, nếu ở VN thì chọn Japan.
  • Tích chọn TLS (SSL) Enabled . Sau đó bấm nút Create
3/ Vercel (Phần 2):
Vào https://vercel.com/integrations/upstash. Bấm Add Integration > Chọn account > next > Specific Projects > chọn project github > Add Integration. Nó sẽ mở ra 1 cửa sổ popup, chờ cho đến khi nó xong hiện cái dòng Complete.
Vào https://vercel.com/dashboard > Chọn project > Deployment > Redeploy

Để đổi domain cho website nó ngắn đi thì vào https://vercel.com/dashboard > Chọn project > Settings > Domains > Bấm vào cái domain chọn edit, đổi thành gì tùy thích miễn là có đuôi .vercel.app (có thể mua domain add vào cũng đc tùy nhu cầu)
E/ Đăng nhập:
Vào domain vừa đổi bước trên, kéo xuống, bấm Proceed to OAuth

Sau đó bấm vào link này

Đăng nhập các kiểu, chấp nhận app các kiểu blabla. Lưu ý: Nếu như bạn chỉ là thành viên trong nhóm onedrive không phải là admin thì nhờ admin vào link đó, bấm đồng ý cho app đó và chọn "Thay mặt cho tổ chức". Rồi vào account của mình kích hoạt bình thường các bước tiếp theo.

Sau khi đăng nhập xong nó sẽ mở ra 1 popup, copy link này

Paste link này vào đây

Bấm Get tokens > Store tokens
Vậy là xong vào lại domain vừa tạo bước trên và thưởng thức.

Lâu lâu nhớ vào project github bấm vào nút này để update phiên bản mới nhé. Chỉ cần ấn là đủ, không cần làm gì hết vercel sẽ tự động deploy


//Một project tương tự dành cho google drive, đơn giản hơn nhiều so với onedrive.
https://github.com/cheems/goindex-extended
//backup hình https://imgur.com/a/kUwU6L6
Có cái nào cho dropbox không bác
 
thí chủ cho hỏi sao nhập cái code kia vào không đc nhể
chắc hết cho đăng kí r, tại mỗi lần đăng kí thì nó sẽ hiện code ra cho mk đăng kí :go:
Thôi đăng kí gói E5 mà xài thôi, nếu cần thì đưa mail của bác cho e để thêm vào gói e5 của e là đc chứ gì :haha:
 
chắc hết cho đăng kí r, tại mỗi lần đăng kí thì nó sẽ hiện code ra cho mk đăng kí :go:
Thôi đăng kí gói E5 mà xài thôi, nếu cần thì đưa mail của bác cho e để thêm vào gói e5 của e là đc chứ gì :haha:
em gửi mail vào vùng kín bác rồi đấy :D
 
sau khi được mod cầm tay chỉ việc đã hoàn thành dự án này!

ngon luôn link dow nhìn chuyên nghiệp hẳn lên khi tự add domain chính chủ zô
 
Back
Top