Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to play Vimeo videos in iOS Swift?

Tags:

ios

swift

vimeo

I create an iOS app that make use of Vimeo for playing videos. I was wondering what the best method is to show Vimeo videos within iOS Swift.

I have fixed that, when an image is clicked, the placeholder image will be hidden, but the video won't play directly. Beside that all Vimeo Interface elements are visible. I know you should have to give credits to Vimeo, so it goes without saying that I display an Vimeo logo at the bottom of the video. Is there a possibility to hide all Vimeo elements of the web player?

Sources where I can find more information would be nice. If there are any questions left, let me know! Thanks in advance.

like image 702
Caspert Avatar asked Nov 23 '16 15:11

Caspert


People also ask

How do I watch Vimeo videos on my iPhone?

Once you are logged in and your library has loaded, tap the image of the video you want to watch. The video's collection will load and you can tap on a video and it will start playing right on the page. To watch in full-screen, click the fullscreen button in the lower right of the video.

How do I get a Vimeo external link?

To access your video's download links, open your video from the video manager and select Settings to the right of the player. Open the Distribution tab and scroll to the Video file links section. Choose “Download the video” and grab any of the URLs provided. ⚠️Caution: The download URLs provided do not expire.


4 Answers

You can use this Swift library HCVimeoVideoExtractor to extract the mp4 video URL then use AVPlayer to play it. Simply pass the Vimeo video link or video id.

let url = URL(string: "https://vimeo.com/254597739")!
HCVimeoVideoExtractor.fetchVideoURLFrom(url: url, completion: { ( video:HCVimeoVideo?, error:Error?) -> Void in                
    if let err = error {                    
       print("Error = \(err.localizedDescription)")                    
       return
    }

    guard let vid = video else {
        print("Invalid video object")
        return
    }

    print("Title = \(vid.title), url = \(vid.videoURL), thumbnail = \(vid.thumbnailURL)")

    if let videoURL = vid.videoURL[.Quality540p] {
        let player = AVPlayer(url: videoURL)
        let playerController = AVPlayerViewController()
        playerController.player = player
        self.present(playerController, animated: true) {
            player.play()
        }
    }                            
})
like image 88
superm0 Avatar answered Nov 01 '22 17:11

superm0


The best way that I've been able to figure out is to use a WKWebView or UIWebView. Steps:

  1. Add a WKWebView of desired size inside the View Controller.

  2. Get the video embed code from the original Vimeo video (Click on the "Share" button below the video to find the embed code.)

    enter image description here

  3. Click on "More Options" on the Vimeo Share sheet that pops-up to configure the look of the embed video.

  4. Use the following code sample to embed the video:

    let webView = WKWebView(frame: CGRect(x: 0, y: 0, width: self.view.frame.size.width, height: self.view.frame.size.height))
    self.view.addSubview(webView)
    
    let embedHTML="<html><head><style type=\"text/css\">body {background-color: transparent;color: black;}</style><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=yes\"/></head><body style=\"margin:0\"><div><iframe src=\"//player.vimeo.com/video/139785390?autoplay=1&amp;title=1&amp;byline=1&amp;portrait=0\" width=\"640\" height=\"360\" frameborder=\"0\" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div></body></html>"
    let url = URL(string: "https://")!
    webView.loadHTMLString(embedHTML as String, baseURL:url )
    webView.contentMode = UIViewContentMode.scaleAspectFit
    
like image 27
Nitin Nain Avatar answered Nov 01 '22 19:11

Nitin Nain


The way that I've managed to implement this is using AVKit and AVFoundation:

let url: URL! = URL(string: "https://01-lvl3-pdl.vimeocdn.com/01/3355/3/91775232/243724947.mp4?expires=1498547278&token=073f7b03877a8ed3c8029")
let player: AVPlayer = AVPlayer(url: url)
let controller: AVPlayerViewController = AVPlayerViewController()

controller.view.translatesAutoresizingMaskIntoConstraints = false
controller.player = player

// Add `controller` to your view somehow

player.play()

The trick being that you cannot use the link where it displays the website (in my case https://vimeo.com/91775232).

I had to inspect the source and find the actual URL for the video (i.e.: https://01-lvl3-pdl.vimeocdn.com/01/3355/3/91775232/243724947.mp4?expires=1498547278&token=073f7b03877a8ed3c8029).

Once I used that, everything worked fine.

like image 2
Michael Loo Avatar answered Nov 01 '22 18:11

Michael Loo


For Swift 4, I have used WKWebView in storyboard and implemented following code:

import WebKit

@IBOutlet weak var webKitView: WKWebView!

To play video in WebView :

if yourVimeoLink.lowercased().contains("vimeo.com") {
            let url: NSURL = NSURL(string: yourVimeoLink)
            webKitView.contentMode = UIViewContentMode.scaleAspectFit
            webKitView.load(URLRequest(url: url as URL))

}

Hope will help! :)

like image 2
JaspreetKour Avatar answered Nov 01 '22 17:11

JaspreetKour