26
votes

When you use an iphone and play video in a webview, this video is open in the native player in fullscreen.

We have tried UIWebView and WKWebView with "allowsInlineMediaPlayback" property to true. But the video in the web content launch in fullscreen with an iphone iOS 10.2. Have you and idea what i can do ?

let webConfiguration = WKWebViewConfiguration()
// Fix Fullscreen mode for video and autoplay
webConfiguration.preferences.javaScriptEnabled = true
webConfiguration.mediaPlaybackRequiresUserAction = false
webConfiguration.allowsInlineMediaPlayback = true

webView = WKWebView(frame: CGRect(x: 0, y: 0, width:self.backgroundView.frame.width, height:self.backgroundView.frame.height), configuration: webConfiguration)

Env : Xcode 8, swift 3

5
Hi. Did you get answer for this?Erik Andershed

5 Answers

22
votes

There is no problem for your code,but you need one more step, the video URL you use should always with a parameter playsinline=1.

//step1
if let videoURL:URL = URL(string: "https://somevideo.mp4?playsinline=1")
//step2
webConfiguration.allowsInlineMediaPlayback = true

then you can do the left things.

18
votes

Here is a solution as you want, i make player programatically and change some code, to play video inline.

var myPlayer: WKWebView!

    override func viewDidLoad() {
        super.viewDidLoad()

        let webConfiguration = WKWebViewConfiguration()
        webConfiguration.allowsInlineMediaPlayback = true
        webConfiguration.mediaTypesRequiringUserActionForPlayback = []

        myPlayer = WKWebView(frame: CGRect(x: 0, y: 0, width: 375, height: 300), configuration: webConfiguration)
        self.view.addSubview(myPlayer)

        if let videoURL:URL = URL(string: "https://www.youtube.com/embed/9n1e1N0Sa9k?playsinline=1") {
             let request:URLRequest = URLRequest(url: videoURL)
             myPlayer.load(request)
        }

        //OR to show player control also, use this
        /*if let videoURL:URL = URL(string: "https://www.youtube.com/embed/9n1e1N0Sa9k?playsinline=1&controls:1") {
             let request:URLRequest = URLRequest(url: videoURL)
             myPlayer.load(request)
        }*/
    }
7
votes

I ended up doing so:

func load(url: String) {
    let html = "<video playsinline controls width=\"100%\" src=\"\(url)\"> </video>"
    self.webView.loadHTMLString(html, baseURL: nil)
}

Load web view as HTML and add some video tags to customise the UX.

3
votes

This worked for me:

let configuration = WKWebViewConfiguration()
if #available(iOS 10.0, *) {
   configuration.mediaTypesRequiringUserActionForPlayback = []
}
configuration.allowsInlineMediaPlayback = true
let webView = WKWebView(frame: frame, configuration: configuration)
1
votes

Here's the best way to do it without needing an HTML string. Also added a test video that's hosted on archive.org so you can avoid the big buck bunny test video horror show:

Swift 4:

if let mediaURL:URL = URL(string: "https://ia800307.us.archive.org/14/items/electricsheep-flock-244-32500-9/00244%3D32649%3D22645%3D23652_512kb.mp4") {
    let request:URLRequest = URLRequest(url: mediaURL);
    self.webView.load(request)
}

Obj-C:

NSURL *mediaURL = [NSURL URLWithString:@"https://ia800307.us.archive.org/14/items/electricsheep-flock-244-32500-9/00244%3D32649%3D22645%3D23652_512kb.mp4"];

NSURLRequest *request = [NSURLRequest requestWithURL:mediaURL]
[self.webView loadRequest:request];