简体   繁体   English

如何使用webview在基于html5离线的Android应用程序中播放mp4视频?

[英]How to play mp4 video in offline html5 based Android app using webview?

I am building an Android app that should work off-line displaying several html pages that each might contain one or two small embedded mp4 videos. 我正在构建一个Android应用程序,它可以离线显示几个html页面,每个页面可能包含一个或两个小的嵌入式mp4视频。 The original html files were used to build the iPhone app that runs without any problem. 原始的html文件用于构建运行没有任何问题的iPhone应用程序。 When the user navigates to a new page, the video files should start playing without any user interaction. 当用户导航到新页面时,视频文件应该开始播放而无需任何用户交互。 The small embedded videos should automatically start and loop infinitely. 小型嵌入式视频应自动启动并无限循环。 I use Android Studio 1.3.2 on Linux Mint 17.2 and with trial and error, and carefully trying some suggestions I found here, I managed to build an app (Android 4.4.2) as follows: 我在Linux Mint 17.2上使用Android Studio 1.3.2并且经过反复试验,并仔细尝试了我在这里找到的一些建议,我设法构建了一个应用程序(Android 4.4.2),如下所示:

In the AndroidManifest.xml I have added hardware acceleration and given access to internet: 在AndroidManifest.xml中,我添加了硬件加速并允许访问互联网:

android:hardwareAccelerated="true"
<uses-permission android:name="android.permission.INTERNET" />

The app is build using: 该应用程序使用以下构建:

compileSdkVersion 22
buildToolsVersion "22.0.1"
minSdkVersion 17
targetSdkVersion 22

In MainActivity.java I have added WebChromeClient and enabled JavaScript. 在MainActivity.java中,我添加了WebChromeClient并启用了JavaScript。 I prevent the user from having to initially touch before a video can be autoplayed using the setMediaPlaybackRequiresUserGesture option: 我阻止用户在使用setMediaPlaybackRequiresUserGesture选项自动播放视频之前必须先触摸:

private WebView mWebView;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    mWebView = (WebView) findViewById(R.id.activity_main_webview);
    mWebView.setWebChromeClient(new WebChromeClient());

    WebSettings webSettings = mWebView.getSettings();
    webSettings.setJavaScriptEnabled(true);
    webSettings.setMediaPlaybackRequiresUserGesture(false);

    mWebView.loadUrl("file:///android_asset/www/index.html");
}

In the index.html file I have the following few attempts to embed a movie file. 在index.html文件中,我有以下几次尝试嵌入电影文件。 The movie is the same mp4 file in all three cases that I copied to the different folders: 在我复制到不同文件夹的所有三种情况下,电影都是相同的mp4文件:

<body>
1) Intern mp4, resides in assets/www
  <video id="vid2" width="100%" autoplay loop controls>
    <source src="./mov_bbb.mp4">
  </video>

2) extern SDcard
  <video id="video" width="100%" autoplay loop controls>
     <source src="file:///mnt/sdcard/cmr/mov_bbb.mp4">
  </video>

3) online WWW
  <video id="video" width="100%" autoplay loop controls>
    <source src="http://www.w3schools.com/html/mov_bbb.mp4">
  </video>
</body>

1)Trying to load and play a mp4 located in assets/www (same as where index.html is located) and packed inside package does not work. 1)尝试加载和播放位于assets / www中的mp4(与index.html所在的位置相同)并打包在包内不起作用。 When I press play button, the video box turns black and resizes to the size of the video, but it doesn't play, I got unknown error: 当我按下播放按钮时,视频框变黑并调整大小到视频大小,但它没有播放,我得到了未知错误:

W/MediaPlayer﹕ info/warning (1001, 0)
E/MediaPlayer﹕ Error (1,-2147483648)

2)Video starts automatically but does not loop. 2)视频自动启动但不循环。 Besides, I don want to have all the movie files located in the external SD card: 此外,我不想让外部SD卡中的所有电影文件:

E/MediaPlayer﹕ Should have subtitle controller already set
W/MediaPlayer﹕ info/warning (3, 0)

3)Online content: Video starts automatically but does not loop. 3)在线内容:视频自动启动但不循环。 I don't want the app to depend on network. 我不希望该应用程序依赖于网络。 Off-line access is an essential part of app. 离线访问是应用程序的重要组成部分。

I/MediaPlayer﹕ setDataSource(http://www.w3schools.com/html/mov_bbb.mp4)
E/MediaPlayer﹕ Should have subtitle controller already set
W/MediaPlayer﹕ info/warning (3, 0)

Is there any reason why embedding mp4 video in package just as you can do with images and html files does not work? 是否有任何理由将mp4视频嵌入到包中,就像你可以处理图像和html文件一样无效? Is there a workaround using additional scripting perhaps that might solve my challenge in building the app? 是否有使用额外脚本的解决方法可能可以解决我在构建应用程序时遇到的挑战? Any help is appreciated. 任何帮助表示赞赏。

我认为你改变了定位保存视频到SD卡

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM