title: How to embed Youtube video in Android WebView?
body: <p>I want to embed a youtube video in my Android app. It has a <a href="https://developer.android.com/design/patterns/navigation-drawer.html" rel="nofollow noreferrer">Navigation Drawer</a>, and when this drawer is opened, the video must to keep playing. And I'd like my app could be capable of playing video with copyright restriction, for example, videos from <a href="https://www.youtube.com/user/VEVO" rel="nofollow noreferrer">Vevo</a>. My first try was simply load the embed url (<code>https://www.youtube.com/embed/VIDEO_ID</code>) in a WebView with a Chrome Client, but for many videos, for example that from Vevo, like <a href="https://www.youtube.com/watch?v=6vImyP5EYc8" rel="nofollow noreferrer">this</a>, I see this message:</p>
  
  <p><code>This Video Contains content from Vevo. It is restricted from playback on certain sites</code></p>
  
  <p>To handle this error, I decided to use the <a href="https://developers.google.com/youtube/" rel="nofollow noreferrer">Youtube API</a>.</p>
  
  <p>Between the available implementations of this lib, I've tried these:</p>
  
  <ul>
  <li><a href="https://developers.google.com/youtube/android/player" rel="nofollow noreferrer">Android API</a></li>
  <li><a href="https://developers.google.com/youtube/iframe_api_reference" rel="nofollow noreferrer">Iframe API</a></li>
  <li><a href="https://developers.google.com/youtube/js_api_reference" rel="nofollow noreferrer">Javascript API</a></li>
  </ul>
  
  <p>The Android API has the advantage that I can play video with the mentioned restriction, but it was discarded because its default behavior is the player stops the video when the Drawer is opened.</p>
  
  <p>With the Iframe API, I can play videos when the Drawer opens, but not that with the restriction.</p>
  
  <p>My last tentative is using the Javascript API. Currently, I have the same situation that iframe, that is, I can't play videos with restriction. </p>
  
  <p>However I think this is the right way of finding a solution. In the <a href="https://developers.google.com/youtube/js_api_reference" rel="nofollow noreferrer">api reference</a>, they recommend using the <a href="https://code.google.com/p/swfobject/" rel="nofollow noreferrer">SWFObject</a>, but as far as i know, there is not flah available for mobile, like exposed in <a href="https://stackoverflow.com/questions/19362049/setpluginsenabled-not-exist-for-webview/19364273#19364273">this answer</a>. So, there is another way of embeding video in my WebView?</p>
  
  <p>And another doubt is: How do mobile sites can play video from youtube, even that with the "certain sites" restriction? Please understand that who is asking here is an Android developer not much experienced with Javascript. </p>
  
  <p>Currently, I have this piece of code:</p>
  
  <p><strong>Layout where will be loaded the player:</strong></p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="match_parent"
      android:layout_height="match_parent"&gt;
  
      &lt;WebView
          android:id="@+id/web_view"
          android:layout_width="match_parent"
          android:layout_height="match_parent" /&gt;
  
  &lt;/FrameLayout&gt;
  </code></pre>
  
  <p><strong>Fragment that inflates this layout:</strong></p>
  
  <pre><code>public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
  
      View view = inflater.inflate(R.layout.fragment, null);
  
      WebView webView = (WebView) view.findViewById(R.id.web_view);
  
      WebSettings webSettings = webView.getSettings();
      webSettings.setJavaScriptEnabled(true);
  
      webView.loadUrl("file:///android_asset/player_webview.html");
      webView.setWebViewClient(new CustomClient());
  
      return view;
  }
  
  private class CustomClient extends WebViewClient {
      @Override
      public boolean shouldOverrideUrlLoading(WebView webview, String url) {
          webview.setWebChromeClient(new WebChromeClient());
          webview.loadUrl(url);
          return true;
      }
  }
  </code></pre>
  
  <p><strong>HTML file</strong></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  
    &lt;script type="text/javascript" src="./swfobject/swfobject.js"&gt;&lt;/script&gt;
  
    &lt;div id="ytapiplayer"&gt;
        You need Flash player 8+ and JavaScript enabled to view this video.
    &lt;/div&gt;
  
    &lt;script type="text/javascript"&gt;
  
      var params = { allowScriptAccess: "always" };
      var atts = { id: "myytplayer" };
      swfobject.embedSWF("http://www.youtube.com/v/G90AgiAMM6k?enablejsapi=1&amp;playerapiid=ytplayer&amp;version=3",
                         "ytapiplayer", "425", "356", "8", null, null, params, atts);
  
    &lt;/script&gt;
  &lt;/head&gt;
  &lt;/html&gt;    
  </code></pre>