iOS原生集成H5+

集成方式

獨立應用方式集成

Widget方式集成

WebView方式集成

可以打開官方鏈接: 選擇 5+SDK -> 5+SDK集成 -> 平臺 下查看集成方式

獨立應用方式: 官方Demo中的實現, 獨立的App, 感覺上和直接在HBuilder創建App相同, 可以方便證書導入這些步驟吧

Widget方式: 模塊部分的擴展使用

WebView方式: 單獨界面的擴展使用

白皮書原話: 在使用中，如果需要顯示多個H5頁面，建議使用Widget集成方式，如果只有一個H5頁面，建議使用WebView集成方式

集成過程

導入SDK相關文件

Snip20170507_10.png

Snip20170507_6.png

導入Pandora相關文件

Snip20170507_13.png

Snip20170507_14.png

修改編譯配置

配置Build Setting

搜索 Other Linker Flags , 配置下拉列表中添加-ObjC

搜索 Enable Bitcode, 配置為 NO

配置info.plist, target -> Info

添加NSAppTransportSecurity字段 -> NSAllowsArbitraryLoads為YES

URL Types -> + -> URL Schemes框配置為 * hbuilder*

寫調用SDK代碼編譯, 報錯按照錯誤提示導入庫, 直到編譯成功

/// AppDelegate

#import "PDRCore.h"

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {

/// 指定5+SDK的模式

return [PDRCore initEngineWihtOptions:launchOptions withRunMode:PDRCoreRunModeNormal];

}

- (void)applicationWillTerminate:(UIApplication *)application {

[PDRCore destoryEngine];

}

@end

#import "PDRCore.h"

@implementation ViewController

- (void)viewDidLoad {

[super viewDidLoad];

// 獨立應用方式加載

// [self start5pAsNormal];

}

/// 滿足一些條件調用

- (void)doSomething {

// Widget方式加載

// [self start5pAsWidget];

// WebView方式加載

// [self start5pAsWebView];

}

- (void)start5pAsNormal {

PDRCore *core = [PDRCore Instance];

if (!core) return;

[core setContainerView:self.view];

[core start];

}

- (void)start5pAsWidget {

PDRCore *core = [PDRCore Instance];

if (!core) return;

// 設置WebApp所在的目錄，該目錄下必須有mainfest.json

NSString* pWWWPath = [[[NSBundle mainBundle] bundlePath] stringByAppendingPathComponent:@"Pandora/apps/H5Demo/www"];

// 設置5+SDK運行的View

[core setContainerView:self.view];

// 傳入參數可以在頁面中通過plus.runtime.arguments參數獲取

NSString* pArgus = @"id=plus.runtime.arguments";

// 啟動該應用

_coreApp = [[core appManager] openAppAtLocation:pWWWPath withIndexPath:@"index.html" withArgs:pArgus withDelegate:nil];

// 如果應用可能會重復打開的話建議使用restart方法

// [[core appManager] restart:_coreApp];

}

- (void)start5pAsWebView {

PDRCore *core = [PDRCore Instance];

if (!core) return;

// 單頁面集成時可以設置打開的頁面是本地文件或者是網絡路徑

NSString* pFilePath = [NSString stringWithFormat:@"file://%@/%@", [NSBundle mainBundle].bundlePath, @"Pandora/apps/H5Dome/www/index.html"];

_appFrame = [[PDRCoreAppFrame alloc] initWithName:@"WebViewID1" loadURL:pFilePath frame:CGRectOffset(self.view.frame, 0, 20)];

// 單頁面運行時設置Document目錄

NSString* pStringDocumentpath = [NSString stringWithFormat:@"%@/Pandora/apps/H5Dome/www/", [NSSearchPathForDirectoriesInDomains(NSLibraryDirectory, NSUserDomainMask, YES) objectAtIndex:0]];

[core.appManager.activeApp.appInfo setWwwPath:pStringDocumentpath];

[core.appManager.activeApp.appWindow registerFrame:_appFrame];

[self.view addSubview:_appFrame];

}

@end

匹配 模式(PDRCoreRunMode) 與 啟動該模式(how start) 的代碼, 否則很容易掉坑里

Demo中其他處理, AppDelegate / ViewController 都可以參照

解決Undefined symbols for architecture xxx: “xxx”, referenced from: 的錯誤提示

屏幕快照 2017-05-06 23.14.25.png

首先使用官方文檔

屏幕快照 2017-05-06 23.14.57.png

導入對應庫

Snip20170506_1.png

還有無法匹配的錯誤, 自行google / baidu

實驗結果總結

獨立應用方式與Widget方式確實相似, 區別部分

/// AppDelegate中

/// 獨立應用方式: 配置為 PDRCoreRunModeNormal

/// Widget方式: 配置為 PDRCoreRunModeAppClient

[PDRCore initEngineWihtOptions:launchOptions withRunMode:PDRCoreRunMode];

/// 配置并啟動5+SDK環境

/// 獨立應用方式: 直接在啟動后的根控制器中設置即可

/// Widget方式: 在需要用啟動的位置設置即可

PDRCore *core = [PDRCore Instance];

if (!core) return;

[core setContainerView:self.view];

[core showLoadingPage]; // 展示啟動頁(讀取頁)

dispatch_async(dispatch_get_main_queue(), ^(void) {

/// 獨立應用方式: 下面倆種都可以開啟

/// Widget方式: 必須使用第二種開啟

[core start];

// [[core appManager] openAppAtLocation:[[[NSBundle mainBundle] bundlePath] stringByAppendingPathComponent:@"Pandora/apps/HelloH5/www"] withIndexPath:@"index.html" withArgs:@"id=plus.runtime.arguments" withDelegate:nil];

});

相關資源鏈接

總結

以上是生活随笔為你收集整理的ios html5上架,iOS原生集成H5+详细流程的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。