Google Drive là 1 nơi lưu trữ dữ liệu của rất nhiều bạn, trong đó có mình. Từ hồi có ý tưởng làm web phim mình đã từng thử up vài bộ lên Google để test và thử nghiệm nhưng khổ cái lúc đó mình chỉ biết dùng Iframe để Embed vào nên nó bê nguyên cái UI xấu quắc bên Google qua.
Sau đó mình có thử tìm trên khoai.tv hay phimmoi thì thấy request từ link dạng:
googleapis.com
Sau này mộng làm web phim vỡ do dính bản quyền và không cạnh tranh được với nhiều site khác. Nhưng bị cái mình hay muốn up 1 số video, 1 số bộ phim lẻ lên website Share Ngay. Lý do không up lên Youtube được vì:
- Nội dung vi phạm bản quyền (phim ảnh),…
- Video quay tutorial mình hay mở nhạc, mình thích bài X, bài Y mà kiểu up lên Youtube bị mất tiếng nên mình up lên server luôn. Điều này khiến source Share Ngay càng ngày càng nặng.
Thì đó là lý do bài viết này ra đời. Mình sẽ demo cho ae 1 đoạn phim nhỏ mình vừa xem, khá hay ho. Nếu được ae xem trên website Share Ngay luôn nhé.
Cách mình hướng dẫn rất đơn giản nhưng có giới hạn:
- Video hình như sẽ bị limit nếu phát nhiều quá.
- Không play được định dạng
.avi
thì phải. Mình mới test thử.mp4
và.mkv
thấy rất OK.
Thì có cách fix 2 cái giới hạn bên trên. Nhưng trong khuôn khổ bài viết này mình không tiện chia sẻ. Hẹn ae ở 1 bài viết khác.
1. Lấy API KEY từ App được tạo bởi Google Developer:
Các bạn vào tạo 1 APP trong API của Google Drive qua link sau:
Sẽ cấp 1 API KEY cho các bạn để lấy đó play video.
Ở đây mình có tạo sẵn API KEY để ae tiện test:
AIzaSyBGW-eFpHa2yL4zKmhp0P5ifB6_XaIFuA0
2. Cấu trúc link và tích hợp video Google Drive bất kỳ vào:
Cấu trúc link sẽ là thế này:
https://www.googleapis.com/drive/v3/files/{id}?alt=media&key=AIzaSyBGW-eFpHa2yL4zKmhp0P5ifB6_XaIFuA0
Với {id}
là ID của video trên Google Drive của bạn. Lấy video sau làm ví dụ:
- https://drive.google.com/open?id=1CUNKpE4qTlOtpQNgnShe9VEKlBZMWsJ_
Phần mình bôi đậm là ID của video trên Google Drive đấy! Video trên nặng 16Gb với chất lượng cực cao.
Giờ các bạn chèn đoạn mã trên vào thẻ video
mặc định của HTML xem thử kết quả như thế nào nhé!
<video autoplay="autoplay" controls="controls" width="300" height="150"> <source src="https://www.googleapis.com/drive/v3/files/1CUNKpE4qTlOtpQNgnShe9VEKlBZMWsJ_?alt=media&key=AIzaSyBGW-eFpHa2yL4zKmhp0P5ifB6_XaIFuA0" type="video/mp4" /> </video>
Kết quả sẽ như thế này:
Ok. Khá là ngon rồi đấy.
3. Chèn trình phát JWPlayer + chèn sub rời + nhận FULL source demo:
Nếu các bạn cần mình sẽ chia sẻ, bộ source này của Quý và Hỵp làm ra khi tạo trang phim. Mình sẽ chia sẻ lại cho ae nào cần để ngâm cứu. Các tính năng gồm:
- Cho phép embed sub rời vào video.
- Cho phép thêm logo custom vào trình phát video để cá nhân hóa.
Hi vọng bài viết này hữu ích với mọi người. Để nhận được bộ code ae cần:
- Đọc trên 2 phút 30 giây cho 3 bài viết và like + rate cuối 3 bài bất kỳ trên Share Ngay.
- Comment lại link 3 bài viết đã đọc 2p30s + like + rate dưới bài viết này.
Mình sẽ gửi source qua email cho ae. Chúc các bạn ngày cuối tuần vui vẻ!