? ? ?這篇文章我會給大家詳細介紹嵌套HTML頁面時楚里，該注意的一些問題废酷。詳細介紹的問題的原因和解決的方案敌卓，部分核心代碼我也會貼出來的慎式，希望能給你帶一些幫助。
（PS：本文寫給未做過嵌套app的猿們趟径，有經(jīng)驗的可直接跳過）
場景一：優(yōu)化橫豎屏的兼容性
? ? 當我們嵌套網(wǎng)頁時瘪吏，可能大部分頁面不會做橫屏模式，只是少數(shù)頁面需要切換橫豎屏舵抹。如果是原生開發(fā)肪虎，只需要在該ViewController類下shouldAutorotate方法中返回yes or no 即可；但是由于我們的項目是由一個WebView來加載惧蛹，頁面的跳轉(zhuǎn)是html本身來控制的扇救，單一的設置shouldAutorotate的返回值只是將全部頁面設置刑枝，和我們要的效果不一樣。所以迅腔，我們要知道該html頁面具有橫豎屏就可以了装畅。
首先定義一個變量來決定橫豎屏模式，這里我就定義一個NSString 類型的變量沧烈，默認值為0（只有豎屏模式）掠兄，值為1代表（可切換橫豎屏模式）?
- (BOOL)shouldAutorotate{
// NSLog(@"_urlNo2:%@",_urlNow);
if([_urlNow isEqualToString:@"1"]){
return YES;
}else{
return NO;
}
}
接下來我們就來根據(jù)實際情況來賦值_urlNow了
1.可以由前端直接通過一個接口傳過來的值來判斷是否橫豎屏，具體實現(xiàn)可看我上篇文章锌雀；（優(yōu)點：可直接由前端控制頁面是否有橫豎屏模式蚂夕，缺點：如果html頁面是在服務器上，每個頁面就多一個網(wǎng)絡請求）
2.我們可通過具有橫豎屏模式html頁面的名稱來判斷腋逆，首先通過webview的代理方法shouldStartLoadWithRequest獲取request.URL.absoluteString婿牍，再通過lastPathComponent截取到頁面的名稱，最后得到的名稱即可判斷該頁面是否橫豎屏模式（相應改變_urlNow的0/1）
還沒完呢３颓浮等脂！要想做好兼容橫豎屏，我們還需要一步撑蚌，適配重力感應告訴前端需要切換頁面的橫豎屏模式上遥；
- (void)viewWillTransitionToSize:(CGSize)size withTransitionCoordinator:(id)coordinator{? ?
? ?[super viewWillTransitionToSize:size withTransitionCoordinator:coordinator];? ?
? ?[coordinator animateAlongsideTransition:^(idcontext) {? ? ?
? //計算旋轉(zhuǎn)之后的寬度并賦值? ? ? ?
? ?CGSize screen = [UIScreen mainScreen].bounds.size;? ? ?
? //界面處理邏輯? ? ?
? // self.lineChartView.frame = CGRectMake(0, 30, screen.width, 200.0);? ? ?
? //動畫播放完成之后? ? ?
? if(screen.width > screen.height){? ? ? ? ? ?
? ? NSLog(@"橫屏"); ? ? ? ? ? ? ?
? ? ?NSString *js = [NSString stringWithFormat:@"mobile.playerEvent((\'{\"keyCode\":\"landscape\"}\'))"];? ? ? ? ? ?
NSLog(@"js:%@",js);? ? ? ?
? ? ? [[HomeWebViewController shareManager].webView stringByEvaluatingJavaScriptFromString:js];? ? ? ? }else{? ? ? ? ?
? NSLog(@"豎屏"); ? ? ? ?
? ? ? NSString *js = [NSString stringWithFormat:@"mobile.playerEvent((\'{\"keyCode\":\"portrait\"}\'))"];? ? ? ? ? ?
? ? NSLog(@"js:%@",js);? ? ? ?
? ? [[HomeWebViewController shareManager].webView stringByEvaluatingJavaScriptFromString:js];? ? ? ? }? ? } completion:^(idcontext) {
NSLog(@"動畫播放完之后處理");
}];
}
場景二：嵌套原生視頻播放器
說到視頻播放器，相信大家很熟悉原生開發(fā)操作流程争涌。無論是使用<MediaPlayer/MediaPlayer.h>粉楚，還是在AVFoundation上建立的AVKit都可以滿足基礎的功能。
接下來介紹網(wǎng)頁嵌套原生播放器第煮！
一般情況下一個嵌套網(wǎng)頁的app解幼，它的底層就是我們那個控制器根View，我們的webView在該根View上包警。但是現(xiàn)在我們需要另一個View去顯示我們播放器（這里我用a帶指代它），a存在的層級由我們的需要來確定底靠。
網(wǎng)頁嵌套播放器也分兩種情況：
1.視頻播放器上的圖標害晦，進度條由原生實現(xiàn)：
這種情況，播放器上面的操作和顯示是由原生來控制的暑中，所以層級關系是根view>webView>a(a在webview上壹瘟，webview在view上);
視頻播放那塊的播放器我就不貼代碼了，可以用原生或者第三方播放器框架來實現(xiàn)
（PS：像嵌套開發(fā)鳄逾，我建議直接使用蘋果提供的AVFoundation自定義的播放器AVPlayer）
AVPlayer：可以理解為播放器對象稻轨，靈活性好，可以高度化的自定義UI雕凹，但它本身不能顯示視頻殴俱，顯示需要另一個類AVPlayerLayer來顯示政冻，繼承于CALayer，下面是摘自官方的一段介紹：
AVPlayer works equally well with local and remote media files.
You can display the visual content of items played by an instance of AVPlayer in a CoreAnimation layer of class AVPlayerLayer.
You can observe the status of a player using key-value observing.
主要是說它支持本地/網(wǎng)絡媒體播放线欲，需要CoreAnimation下的AVPlayerLayer來顯示視頻明场，我們可以通過KVO監(jiān)聽player的播放狀態(tài)。
AVPlayerItem：存有相關媒體信息的類李丰，一個視頻資源對應一個AVPlayerItem對象苦锨，當你需要循環(huán)播放多個視頻資源時也需創(chuàng)建多個AVPlayerItem對象。建議大家可以多看看官方的英文文檔解釋（題外話）趴泌。
An AVPlayerItem represents the presentation state of an asset that’s played by an AVPlayer object, and lets you observe that state.
AVAsset：主要用于獲取多媒體信息舟舒，可以理解為一個抽象類，不能直接使用嗜憔，操作針對它的子類AVURLAsset魏蔗，根據(jù)你視頻的url創(chuàng)建一個包含視頻媒體信息的AVURLAsset對象。
CMTime：還會用到這個媒體時間相關的類痹筛，如有不明白可以看之前一個帖子的解釋莺治。
實現(xiàn)了播放器后，我們需要與js交互了帚稠，由html調(diào)用我們初始化的播放器的接口谣旁，傳達的基本參數(shù)有（視頻的鏈接url，和視頻播放器的位置【x坐標,y坐標,w寬,h高】）;
2.視頻播放器上的圖標滋早，進度條由html實現(xiàn)（ps：這種雖然比較麻煩榄审，但推薦使用這種方式；做嵌套的視頻通話原理也是這樣）：
這種情況杆麸，播放器上面的操作和顯示是由html來控制的搁进，所以層級關系是根view>a? view>webView(a先加在view上，再webview加在view上);
注：需要設置
webView.backgroundColor = [UIColor clearColor]
webView.opaque = NO;
不僅僅html通過js傳達的基本參數(shù)（視頻的鏈接url昔头，和視頻播放器的位置【x坐標,y坐標,w寬,h高】）饼问，還需要把視頻這層<Div>設置透明色，否則會遮擋視頻揭斧。
接下來就是js和oc的交互（比如點擊暫停按鈕調(diào)用oc的暫停接口）莱革，具體的實現(xiàn)可看我的上篇文章。
寫到這里嵌套原生播放器完成了讹开？盅视？
是的，但是我相信部分人會遇到下面這個問題旦万。
由于我們是嵌套html是大部分由一個控制器（ViewController）來加載闹击，視頻頁面和其他頁面切換時，我們需要手動把視頻播放器暫停后再銷毀了（上面說的a不需要銷毀但需要removeFromSuperview）成艘，否則離開播放頁面后視頻仍然在播放可聽到聲音或者那個視頻播放器視圖也一直存在赏半。
最后贺归，我解答部分小伙伴提出的疑惑，蘋果會讓嵌套的web應用能否通過審核除破？還是說需要部分嵌套部分原生才行牧氮？
在這里我很負責的告訴大家沒問題的，蘋果審核團隊不會因為你頁面全部是web實現(xiàn)的打退回來瑰枫。本人已經(jīng)上架多個嵌套html的app踱葛，包括幫通信運營商開發(fā)地頁面全部采用html的iOS App都得到了通過，所以說放心地去做移動端原生嵌套開發(fā)光坝！
