如何快速的開發一個完整的iOS直播app(播放篇)

前言

在看這篇之前，如果您還不了解直播原理，請檢視上篇文章如何快速的開發一個完整的iOS直播app(原理篇)

開發一款直播app，內建ijkplayer成功後，就算完成直播功能一半的工程了，隻要有拉流url，就能播放直播啦

本篇主要講解的是直播app中，需要用到的一個很重要的開源架構

ijkplayer

，然後內建這個架構可能對大多數

初學者

還是比較有難度的，是以本篇主要教你

解決內建【ijkplayer】遇見的各種坑

。

很多文章，可能講解的是如何做，我比較注重講解

為什麼

這樣做,大家有什麼不明白，還可以

多多提出來

。

如果喜歡我的文章，可以關注我微網誌:吖了個峥,也可以來小碼哥，了解下我們的iOS教育訓練課程。後續還會更新更多内容,有任何問題，歡迎

簡書留言

峥吖。。。

效果

直播.gif

一、基本知識

README.md檔案

：架構的描述檔案，描述這個架構怎麼使用

編譯語言

:程式在被執行之前，需要一個專門的編譯過程，把程式編譯成為機器語言的檔案，運作時不需要翻譯，是以編譯型語言的程式執行效率高，比如OC,C,C++

解釋性語言

:解釋性語言的程式不需要編譯，在運作程式的時候才翻譯，每個語句都是執行的時候才翻譯。這樣解釋性語言每執行一次就需要逐行翻譯一次，效率比較低

解釋性語言執行和編譯語言執行的差別

：

• 解釋性語言一行一行的解析，如果有錯誤，就不會執行，直接執行下一行。
• 編譯語言，隻要有錯，就不能編譯，一行都不能執行。

腳本語言

:屬于解析語言，必須通過解釋器解析，将其一條條的翻譯成機器可識别的指令，并按程式順序執行。

• python：腳本語言，适合網絡應用程式的開發，有利于開發效率，現在顯得越來越強大
• PHP：伺服器端腳本語言，适合做動态網站
• JS：作為用戶端的腳本語言，在浏覽中解釋執行，
• shell：作業系統腳本語言，一般指Unix/Linux中使用的指令行
• 編譯語言，執行檔案是二進制。腳本語言是解釋執行的，執行檔案是文本

shell解釋器

:shell是一個指令行解釋器，相當于windows的cmd,處于核心和使用者之間，負責把使用者的指令傳遞給核心并且把執行結果回顯給使用者.

• 預設Unix都有shell,OS基于Unix,是以OS自帶shell。

bash

: bash是一種shell解釋器版本，shell有很多種版本，就像人，也分不同國家的人。

• 牛程式員看到不爽的Shell解釋器，就會自己重新寫一套，慢慢形成了一些标準，常用的Shell解釋器有這麼幾種，sh、bash、csh等

shell

:通常我們說的shell,指的是shell腳本語言，而不是shell解釋器。

• 在編寫shell時，第一行一定要指明系統需要哪種shell解釋器解釋你的shell腳本，如：#! /bin/bash，使用bash解析腳本語言

• 什麼時候使用shell指令

  ，比如有些系統指令經常需要用到，可以把指令封裝到一個腳本檔案，以後就不用再敲一遍了，直接執行腳本語言。
• 比如ijkplayer,就用腳本檔案下載下傳ffmpeg,因為下載下傳ffmpeg需要執行很多指令，全部封裝到腳本檔案中。
• 在導入一些第三方架構的時候，經常需要用到一些指令，是以一般都會封裝到一個腳本檔案中，以後隻要執行腳本，就會自動執行內建第三方架構的指令。

sh

:sheel腳本檔案字尾名

二、下載下傳ijkPlayer

• 去到B站得github首頁，找到ijkplayer項目，下載下傳源碼 ijkplayer下載下傳位址
• 打開Demo，檢視用法，

  一般學習第三方庫，都是先檢視Demo

  

  Snip20160825_4.png

三、編譯ijkPlayer的步驟

1、找到ijkPlayerMediaDemo并運作

• 提示

  'libavformat/avformat.h' file not found

bug1.png

原因

：因為libavformat是ffmpeg中的庫，而ijkplayer是基于ffmpeg這個庫的，是以需要導入ffmpeg

解決

：檢視ijkplayer的README.md，一般都會有說明。

執行腳本.png

init-ios.sh

腳本的作用：下載下傳ffmpeg源碼

• 想了解腳本具體怎麼做的，可以檢視之前寫的文章帶你走進腳本世界，ijkplayer之【init-ios.sh】腳本分析，全面剖析了

  init-ios.sh

  這個腳本做了哪些事情。

如何執行

init-ios.sh

腳本檔案

• 步驟一：

  找到init-ios.sh腳本檔案

找到init-ios.sh檔案.png

• 步驟二：

  打開終端，cd進入到ijkplayer-master的目錄中

進入init-ios.sh目錄.png

• 注意是 cd 這個檔案夾

cd ijkplayer-master.png

• 步驟三：

  輸入./init-ios.sh，就會執行目前腳本了。

執行init-ios.sh.png

• 執行完腳本後，就會發現ijkplayer中有

  ffmpeg

  了

執行腳本後.png

2、下載下傳好ffmpeg源碼後，再次運作Demo

• 發現還是報

  'libavformat/avformat.h' file not found

  錯誤

• 原因

  :執行init-ios.sh，

  僅僅是下載下傳源碼

  ，但是源碼并沒有參與編譯，需要把源碼編譯成.a檔案
  • Demo依賴于IJKMediaPlayer庫

Demo源碼.png

• 打開 IJKMediaPlayer庫，檢視下源碼

IJKMediaPlayer工程位置.png

• 打開 IJKMediaPlayer庫

  

  IJKMediaPlayer源碼.png
• 右擊，發現FFMPEG中的庫都是紅的，表示不存在

  

  Snip20160829_23.png

• 解決

  :檢視ijkplayer的README.md

編譯ffmpeg.png

編譯ffmpeg庫

• 步驟一：進入到

  腳本檔案

  的目錄下

  

  cd ios.png

• 步驟二：執行

  ./compile-ffmpeg.sh clean

  • 步驟二功能：删除一些檔案和檔案夾，為編譯ffmpeg.sh做準備，在編譯ffmpeg.sh的時候，會自動建立剛剛删除的那些檔案，為避免檔案名沖突，是以在編譯ffmpeg.sh之前先删除等會會自動建立的檔案夾或者檔案

Snip20160828_19.png

• 步驟三：執行./compile-ffmpeg.sh all,真正的編譯各個平台的ffmpeg庫，并生成是以平台的通用庫.

執行./compile-ffmpeg.sh all

執行compile-ffmpeg.sh all前

編譯前.png

執行compile-ffmpeg.sh all後

編譯後.png

3.再次運作Demo,就能成功了,因為IJKMediaPlayer庫擷取到ffmpeg庫了

• 編譯完ffmpeg後，IJKMediaPlayer庫中顯示

  

  成功擷取到ffmpeg庫.png
• cmd+r,Demo運作成功

Demo運作成功.png

四、如何內建到ijkplayer到自己的項目中

• 注意：

  ijkplayer

  的

  README

  中的方法比較麻煩，不友善攜帶，不推薦。

Snip20160830_9.png

1.推薦自己把IJKMediaPlayer打包成靜态庫,在導入到自己的項目中。

• 如何打包，請參考，iOS中內建ijkplayer視訊直播架構，寫的非常不錯，就不一一詳細介紹了,但是

  隻有釋出版本的庫

  。
• 我自己打包了ijkplayer兩個版本庫，分别用于調試和釋出(DEBUG和Release),點選下載下傳
• 由于檔案太大上傳不了GitHUb,就上傳到百度雲了

2.直接把ijkplayer庫拖入到自己的工程中，

• 調試的話，拖入調試版本的ijkplayer庫，釋出的話，拖入釋出版本的ijkplayer庫

Snip20160829_5.png

3.導入ijkplayer依賴的庫，具體可以檢視ijkplayer的README

Snip20160829_6.png

Snip20160829_7.png

五、使用ijkplayer直播

1.ijkplayer用法簡介

• ijkplayer用法比較簡單，其實隻要有直播位址，就能直播了
• 注意：最好

  真機測試

  ，模拟器測試

  比較卡,不流暢

  ，真機就沒有問題了

2.抓取資料

• 抓了很多直播app的資料，發現映客主播的品質是最高的。
• 映客主播url:http://116.211.167.106/api/live/aggregation?uid=133825214&interest=1
  • uid=賬号ID，這裡是我的賬号ID
  • interest=興趣 ，1表示隻檢視女生，哈哈
  • 上下拉重新整理的接口沒抓到，就一下加載200條資料，哈哈

Objective-C

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

- ( void ) loadData {      // 映客資料url      NSString *urlStr = @"http://116.211.167.106/api/live/aggregation?uid=133825214&interest=1" ;        // 請求資料      AFHTTPSessionManager *mgr = [ AFHTTPSessionManager manager ] ;      mgr . responseSerializer = [ AFJSONResponseSerializer serializer ] ;      mgr . responseSerializer . acceptableContentTypes = [ NSSet setWithObjects : @"text/plain" , nil ] ;      [ mgr GET :urlStr parameters :nil progress :nil success : ^ ( NSURLSessionDataTask * _Nonnull task , NSDictionary * _Nullable responseObject ) {            _lives = [ YZLiveItem mj_objectArrayWithKeyValuesArray :responseObject [ @"lives" ] ] ;            [ _tableView reloadData ] ;        } failure : ^ ( NSURLSessionDataTask * _Nullable task , NSError * _Nonnull error ) {            NSLog ( @"%@" , error ) ;        } ] ; }

3.擷取拉流url,直播

• IJKFFMoviePlayerController

  ：用來做直播的類

Objective-C

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26

- ( void ) viewDidLoad {      [ super viewDidLoad ] ;        self . view . backgroundColor = [ UIColor whiteColor ] ;        // 設定直播占位圖檔      NSURL *imageUrl = [ NSURL URLWithString : [ NSString stringWithFormat : @"http://img.meelive.cn/%@" , _live . creator . portrait ] ] ;      [ self . imageView sd_setImageWithURL :imageUrl placeholderImage :nil ] ;        // 拉流位址      NSURL *url = [ NSURL URLWithString : _live . stream_addr ] ;        // 建立IJKFFMoviePlayerController：專門用來直播，傳入拉流位址就好了      IJKFFMoviePlayerController *playerVc = [ [ IJKFFMoviePlayerController alloc ] initWithContentURL :url withOptions :nil ] ;        // 準備播放      [ playerVc prepareToPlay ] ;        // 強引用，反正被銷毀      _player = playerVc ;        playerVc . view . frame = [ UIScreen mainScreen ] . bounds ;        [ self . view insertSubview :playerVc . view atIndex : 1 ] ;   }

4.結束播放

• 界面不播放，一定要記得結束播放，否則會報記憶體溢出

記憶體bug.png

Objective-C

1 2 3 4 5 6 7 8

- ( void ) viewWillDisappear : ( BOOL ) animated {      [ super viewWillDisappear :animated ] ;        // 界面消失，一定要記得停止播放      [ _player pause ] ;      [ _player stop ] ; }

結束語

後續還會更新更多有關直播的資料，希望做到教會每一個朋友從零開始做一款直播app，并且Demo也會慢慢完善.

Demo點選下載下傳

• 由于FFMPEG庫比較大，大概100M。
• 本來想自己上傳所有代碼了，上傳了1個小時，還沒成功，就放棄了。
• 提供另外一種方案，需要你們自己導入IJKPlayer庫

  具體步驟：

• 下載下傳Demo後，打開YZLiveApp.xcworkspace問題

打開YZLiveApp.xcworkspace問題

• pod install就能解決

Snip20160830_12.png

• 下載下傳jkplayer庫，點選下載下傳
• 把jkplayer直接拖入到與Classes同一級目錄下，直接運作程式，就能成功了

拖入ijkplayer到與Classes同一級目錄下.png

• 注意不需要

  打開工程，把jkplayer拖入到工程中

  ，而是直接把jkplayer庫拷貝到與Classes同一級目錄下就可以了。
• 錯誤示範:

  不要向下面這樣操作

Snip20160830_14.png