Youtube Video Autoplay Inside Uiwebview

Is it not possible to autoplay embedded YouTube videos using UIWebView?

Here is a Swift-ified version of the top-rated obj-c answer to How to autoplay a YouTube video in a UIWebView.

Apparently the problem was with the nil base url, when I changed it to resourceURL the autoplay worked.

Here's the code:

var youTubeVideoHTML: String = "<!DOCTYPE html><html><head><style>body{margin:0px 0px 0px 0px;}</style></head> <body> <div id=\"player\"></div> <script> var tag = document.createElement('script'); tag.src = \"http://www.youtube.com/player_api\"; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); var player; function onYouTubePlayerAPIReady() { player = new YT.Player('player', { width:'%0.0f', height:'%0.0f', videoId:'%@', events: { 'onReady': onPlayerReady, } }); } function onPlayerReady(event) { event.target.playVideo(); } </script> </body> </html>"

func playVideoWithId(videoId: String) {
var html: String = String(format: youTubeVideoHTML, self.frame.size.width, self.frame.size.height, videoId)

}

How to autoplay a YouTube video in a UIWebView swift

I also faced similar issue and ended up using helper Library of Google

https://github.com/youtube/youtube-ios-player-helper

    let player = YTPlayerView(frame: CGRect(0,0,view.frame.width , 300))
let dict = ["modestbranding" : 0,"controls" : 1 ,"autoplay" : 1,"playsinline" : 1,"autohide" : 1,"showinfo" : 0]
player.loadWithVideoId("video-ID" ,playerVars: dict)
player.delegate = self

Call this delegate function then

func playerViewDidBecomeReady(_ playerView: YTPlayerView) {
playerView.playVideo()

}

Youtube video autoplay inside UIWebview

Q. If I am correct that (2) is recommended

A. Yes (2) method is for i-devices where no flash support.

Q. Autoplay with (2) is not possible.

A. No autoplay is not possible as of now.

Update: I am able to autoplay youtube video by using Youtube JS APIs see https://developers.google.com/youtube/js_api_reference

Just call playVideo from onPlayerReady

function onPlayerReady(event) {
event.target.playVideo();
}

How to autoplay a YouTube video in a UIWebView

Apparently the problem was with the nil base url, when I changed it to resourceURL the autoplay worked.

[self loadHTMLString:html baseURL:[[NSBundle mainBundle] resourceURL]];  

The full code for autoplay youtube videos (again this code mostly based on this post I just changed it to load from a string instead of a file):

static NSString *youTubeVideoHTML = @"<!DOCTYPE html><html><head><style>body{margin:0px 0px 0px 0px;}</style></head> <body> <div id=\"player\"></div> <script> var tag = document.createElement('script'); tag.src = \"http://www.youtube.com/player_api\"; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); var player; function onYouTubePlayerAPIReady() { player = new YT.Player('player', { width:'%0.0f', height:'%0.0f', videoId:'%@', events: { 'onReady': onPlayerReady, } }); } function onPlayerReady(event) { event.target.playVideo(); } </script> </body> </html>";  

- (void)playVideoWithId:(NSString *)videoId {
NSString *html = [NSString stringWithFormat:youTubeVideoHTML, self.frame.size.width, self.frame.size.height, videoId];

[self loadHTMLString:html baseURL:[[NSBundle mainBundle] resourceURL]];
}

How to autoplay youtube video in WKWebView?

Use iFrame to load a video on WKWebview and write the script to autoplay video. see the following code.

class YouTubeVideoPlayerVC: UIViewController {

@IBOutlet weak var videoPlayerView: WKWebView!
var videoURL:URL! // has the form "https://www.youtube.com/embed/videoID"
var didLoadVideo = false

override func viewDidLoad() {
super.viewDidLoad()
videoPlayerView.configuration.mediaTypesRequiringUserActionForPlayback = []
}

override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()
// Size of the webView is used to size the YT player frame in the JS code
// and the size of the webView is only known in `viewDidLayoutSubviews`,
// however, this function is called again once the HTML is loaded, so need
// to store a bool indicating whether the HTML has already been loaded once
if !didLoadVideo {
videoPlayerView.loadHTMLString(embedVideoHtml, baseURL: nil)
didLoadVideo = true
}
}

var embedVideoHtml:String {
return """
<!DOCTYPE html>
<html>
<body>
<!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
<div id="player"></div>

<script>
var tag = document.createElement('script');

tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
playerVars: { 'autoplay': 1, 'controls': 0, 'playsinline': 1 },
height: '\(videoPlayerView.frame.height)',
width: '\(videoPlayerView.frame.width)',
videoId: '\(videoURL.lastPathComponent)',
events: {
'onReady': onPlayerReady
}
});
}

function onPlayerReady(event) {
event.target.playVideo();
}
</script>
</body>
</html>
"""
}
}

See the following post for more info Autoplay YouTube videos in WKWebView with iOS 11

autoplay on video in UIWebview,iOS

Thanks @Kyle, I tried your comment , I added the &autoplay=1 in after the URL it working perfectly. The answer is

NSString *url=@"https://www.youtube.com/watch?v=7jYa7dfrXKU&autoplay=1";

[self.webvie loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:url]]];
self.webvie.scrollView.bounces = NO;
[self.webvie setMediaPlaybackRequiresUserAction:NO];


Related Topics



Leave a reply



Submit