[TIMOB-24251] Android: Local html video content is not displaying in titanium webview

GitHub Issue	n/a
Type	Bug
Priority	High
Status	Open
Resolution	Unresolved
Affected Version/s	n/a
Fix Version/s	n/a
Components	Android
Labels	n/a
Reporter	Jebun Naher
Assignee	Gary Mathews
Created	2016-12-21T11:45:22.000+0000
Updated	2019-03-10T21:29:24.000+0000

Description

*Issue description:* I tried to use a local html video content in Titanium webview but it doesn't display the video content. *Test code*:

var win=Ti.UI.createWindow({ 
height:Ti.UI.FILL, 
width:'100%' 
});

var webview = Ti.UI.createWebView({ 
url:'movie.html', 
});

win.add(webview);
win.open();

*movie.html*

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
</head>

<body>
    <div id="contentAll">

    <div id="contentHead">
        <div id="movieArea">
            <video id="video" autoplay>
                <source src="movie01.mp4">
            </video>
        </div>
    </div>
</html>

Attached is the movie.mp4 video file. *Steps to reproduce:* 1. Create a project with the above code and run it on device 2. It doesn't play the video *Expected:* The video content should play *Actual:* Video doesn't play

Attachments

File	Date	Size
movie01.mp4	2016-12-21T11:43:29.000+0000	5180818

Comments

Chee Kiat Ng 2016-12-22

Can we do this natively to see if it is supposed to work?

Gary Mathews 2016-12-27

autoplay does not work on Android 4.4+; you also need to define an onclick event. Try this: *app.js*

   var w = Ti.UI.createWindow(),
       wv = Ti.UI.createWebView({
           width: Ti.UI.FILL,
           height: Ti.UI.FILL,
           url: 'index.html',
           scalesPageToFit: true
       });
   
   w.add(wv);
   w.open();

*index.html*

   <html>
       <body>
           <video id="video1" autobuffer height="480" width="368" onclick="this.play()">
               <source src="movie01.mp4">
           </video>
       </body>
   </html>

NOTE: you can just use the index.html code as a base since you are using Alloy

JSON Source