Search code examples
google-drive-apionedrivehtml5-video

getting videos in google drive (and Microsoft onedrive) to show in a video tag?


I have a website that has a web page with a html5 video-tag, and the user can supply a URL, and it will play in the video-tag.

The webpage uses JavaScript commands that control the video-tag - for instance, it can pause the video, move to a different point in the video, etc.

It works fine with the cloud. Videos stored on Microsoft Azure can be used, for instance (Azure gives you a way to get a URL to any video on your cloud storage, and streams it too).

However, I have users that store videos on Google-drive, and also on Microsoft One-Drive.

From what I can see, I can play these videos, but only in a page (probably with Google's own player in it) on their site.

It seems that there is no way to get a URL to these videos that I can put in a video tag.

Without the ability to do that, I can't use the javascript commands that work with the html5 video-tag.

Is there any workaround?

Or am I missing something?

Thanks.


Solution

  • For playing videos that are stored in google-drive using your app:

    • you need oauth2 credentials to access the user's drive, but assuming you have the oauth part covered :

    • you can create a drive application as a google appengine app and deploy it in a part of your website.

    • enable the drive-sdk and set the open-url to your website (that you have verified) -> basically this tells drive to redirect towards your website whenever the user clicks on the video (from his drive)

    • when drive redirects to your website a json file will be sent, you'll have informations such as fileId from there i think you can execute the method files().get() to retrieve the necessary information for you to play the video

    I advise you to take a look at this course in codeschool.