Local video files won't play in Cordova Android App

Question

I'm building an app in Cordova where the first page of the app contains a video tag set to autoplay. I don't get any 404 errors loading the file... The file just won't play. The video is just black with a 0:00 time length that doesn't change.

The strange thing is I get two network requests in Chrome remote dev tools for the video file: the first shows a (success) status, and the second has a status of (cancelled). I've tried using two different URLs for the file:

file:///android_asset/www/video/nameofmyvideo.mp4 with the video file actually in /www/video/nameofmyvideo.mp4.

and

android.resource://mypackagename/raw/nameofmyvideo with the video file actually in /www/res/raw/nameofmyvideo and /platforms/android/res/raw/nameofmyvideo

I'm running the latest cordova (3.4.1-0.1.0) and testing on a kindle fire running CM-11 (4.4.2).

Here's the the markup I'm using:

<video width="400px" height="300px" autoplay controls>
    <source src="file:///android_asset/www/video/video-test.mp4" type="video/mp4">
</video>

OR

<video width="400px" height="300px" autoplay controls>
    <source src="android.resource://my.package.name/raw/videotest" type="video/mp4">
</video>

Is this an android pathing issue? The app runs fine as-is in iOS. I've also tried using webm, with no success.

edit:

Also it seems that the double network load issue (one success, one cancelled) happens regardless of whether the file can actually load. I loaded the same mp4 file over http hosted on my website and the video played fine (but still showed both requests).

Answer 1

Its not possible to read video from inside assets folder on android, you need to place it somewhere outside app, sdcard or remotely. That's because APK is compressed JAR basically and files in assets needs to be decompressed to work, and Android can't decompress video files from APK.

Answer 2

well in case somebody needs it, you may embed below code. I've tried it and it works both in android and ios.

<object CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" width="100%" CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">
                                <param name="src" value="{{filename}}">
                                <param name="qtsrc" value="{{filename}}">
                                <param name="autoplay" value="false">
                                <param name="loop" value="false">
                                <param name="controller" value="true">
                                <embed src="{{filename}}" qtsrc="{{filename}}" width="100%" autoplay="true" loop="false" controller="true" pluginspage="http://www.apple.com/quicktime/"></embed>
                            </object>