WebView 和 HTML5 <视频>

Question

我正在拼凑一个便宜的应用程序，其中包括“框架”我们的一些网站……非常简单 WebViewClient 。直到我点击视频。

视频以 HTML5 元素的形式完成，这些元素在 Chrome、iPhone 上运行良好，而且现在我们修复了编码问题，它在原生浏览器中的 Android 上运行良好。

现在摩擦： WebView 不喜欢它。完全没有。我可以点击海报图片，没有任何反应。

谷歌搜索，我发现 这 很接近，但似乎基于“链接”（如在href …中）而不是视频元素。 （onDownloadListener 似乎没有在视频元素上被调用……）

我还看到了对覆盖 onShowCustomView 的引用，但这似乎没有在视频元素上被调用…… shouldOverrideUrlLoading 也没有……

我宁愿不进入“从服务器中提取 xml，在应用程序中重新格式化它”。通过将故事布局保留在服务器上，我可以更好地控制内容，而不会强迫人们不断更新应用程序。因此，如果我能说服 WebView 像原生浏览器一样处理标签，那将是最好的。

我显然错过了一些明显的东西..但我不知道是什么。

原文由 brian moore 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

可以在 WebView 中查看视频元素（视频 html5 标记），但我必须说我不得不处理它几天。这些是我到目前为止必须遵循的步骤：

• 查找正确编码的视频

• 初始化 WebView 时，设置 JavaScript、插件、WebViewClient 和 WebChromeClient。

   url = new String("http://broken-links.com/tests/video/");
  mWebView = (WebView) findViewById(R.id.webview);
  mWebView.setWebChromeClient(chromeClient);
  mWebView.setWebViewClient(wvClient);
  mWebView.getSettings().setJavaScriptEnabled(true);
  mWebView.getSettings().setPluginState(PluginState.ON);
  mWebView.loadUrl(url);

• 处理 WebChromeClient 对象中的 onShowCustomView。

   @Override
  public void onShowCustomView(View view, CustomViewCallback callback) {
      super.onShowCustomView(view, callback);
      if (view instanceof FrameLayout){
          FrameLayout frame = (FrameLayout) view;
          if (frame.getFocusedChild() instanceof VideoView){
              VideoView video = (VideoView) frame.getFocusedChild();
              frame.removeView(video);
              a.setContentView(video);
              video.setOnCompletionListener(this);
              video.setOnErrorListener(this);
              video.start();
          }
      }
  }

• 处理视频的 onCompletion 和 onError 事件，以便返回 Web 视图。

   public void onCompletion(MediaPlayer mp) {
      Log.d(TAG, "Video completo");
      a.setContentView(R.layout.main);
      WebView wb = (WebView) a.findViewById(R.id.webview);
      a.initWebView();
  }

但是现在我应该说还有一个重要的问题。我只能玩一次。我第二次单击视频调度程序（海报或某些播放按钮）时，它什么也没做。

我还希望视频在 WebView 框架内播放，而不是打开媒体播放器窗口，但这对我来说是次要问题。

原文由 mdelolmo 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

这个问题已经有好几年了，但也许我的回答会帮助像我这样必须支持旧 Android 版本的人。我尝试了很多不同的方法，这些方法适用于某些 Android 版本，但不是全部。我发现的最佳解决方案是使用针对 HTML5 功能支持进行了优化并适用于 Android 4.1 及更高版本的 Crosswalk Webview 。它与默认的 Android WebView 一样简单易用。你只需要包括图书馆。在这里您可以找到有关如何使用它的简单教程： https ://diego.org/2015/01/07/embedding-crosswalk-in-android-studio/

原文由 Apfelsaft 发布，翻译遵循 CC BY-SA 3.0 许可协议