コルドバは、ネイティブアプリケーションと分離されたH5の使用を使用します

個人オリジナル住所:https://www.jianshu.com/p/1ad536e76640

### 1.需要や利用シナリオ
 &EMSP、新しいページを開き、H5ローカルzip形式を適用ロードする機能が必要で、アプリケーションがネイティブ容量の一部を使用して、リモート・アプリケーションをロードすることができ、また、アプリケーションはネイティブ容量の一部を使用しています;それは同様に適用することができるときにアプリケーションH5複数の、例えばウェブ、第三者モバイルアプリケーションなどの他のシーンへのH5アプリケーションの移植;フィッティング複合移動終了せずH5アプリケーション、Androidなど、他のiOS;
### 2.目的
&EMSP。  ネイティブ関数に関連し、H5 H5アプリケーションにのみ開発に注力してみましょう、H5コルドバjsの関数を使用してネイティブ関数との対話、達成するためにネイティブアプリケーションに与えられます。
3.前提###
 &EMSP、次のように3つのアプリケーションが必要です
* H5アプリケーションを:のみ、開発者および包装用途の開発のフロントエンドのフロントエンドに焦点を当て、アプリケーション反応し、イオン性、VUEをサポートする必要があります
*コルドバアプリケーションをネイティブ開発作成し、プラグはコルドバコルドバのアプリケーションをインストールし、対応するプラットフォーム、すなわちアンドロイド、iOSの生成されます
*ネイティブアプリケーション:コルドバプラグインPODへのiOSアプリケーション、およびconfig.xmlのグループモードを追加することで、作成するためのネイティブ開発者が、WWWを配置フォルダのフォルダ形式は、すなわちconfig.xmlの相対パス、WWWが導入絶対パスを導入し、導入され、

三つ以上のアプリケーションの解釈:
> - TSを使用する場合H5アプリケーション、通常のフロントエンド・アプリケーション、使用JSを宣言しませんコルドバせ宣言`宣言する必要があります:任意の;`グローバル変数
>
> -コルドバのアプリケーション、config.xmlファイルオブジェクトおよびプラットフォーム/アンドロイド/ WWW、プラットフォーム/ IOS / WWWのフォルダのバックアップコピーアウト。cordova.jsは、ネイティブプラグインexecを呼び出すためにので、それは、オリジナルの開発者が作成したカテゴリに分類され、ネイティブアプリケーションにプラグインを管理します。
>
> -ネイティブアプリケーション、管理プラグイン、対応する天然の能力を提供します。使用cordova.exec相互作用(推奨)、その後、config.xmlを導入WWW / cordova.js;対話型サービスモードのJSの使用、アプリケーションはH5 NPMパッケージをロードする必要は、コルドバは、ウィジェットアプリケーション、およびプラットフォームを追加しました/./ WWWフォルダには、ネイティブアプリケーションの下に置く、それをコピーします。

### 4.ネイティブパート
のiOSへの例えば一部省略H5テーブルアプリケーション、ネイティブ一部
***プロジェクトコルドバを作成する方法4.1 ***
* Macで、ノードをインストールし、NPMで、端末に-gコルドバ@最新のをインストール;
* `コルドバて、myApp org.apache.cordova.myApp myApp`を作成したアプリケーションを作成する
CD *プロジェクトディレクトリの下にmyApp``
*追加コルドバ・プラグインコルドバ`プラグインcamera`プラグ
* iOSアプリケーションはios`プラットフォームcordova`を追加生成
*コルドバアプリケーション/ IOS / WWWでのconfig.xmlおよびプラットフォームは、私たちが使用する必要があるということです

もはやのUIWebView欠陥及び4.2は維持され、関係者は、WKWebView推奨WKWebView例は、$ \カラー{#1 FF7F50} {にそれほどのconfig.xml} $ 修正および$ \カラー{#1 FF7F50} {コルドバ、プラグイン-wkwebview-エンジン} $は簡単な説明に使用されている
*** *** 4.2.1 config.xmlの提出を
1.リモートページはATSをロードできるように
`` `
<コンテンツsrcは= "index.htmlを"/>がローカルにロードされています入口は、リモートアドレスを提供することができる
。<ナビゲーションが可能-のhref = "HTTPSを:// * / *" />
<ナビゲーションが可能-のhref = "HTTPを:// * / *" />
<ナビゲーションが可能-のhref =「データ: * "/>
` ``
3行と同等以上の
`
<ナビゲーションできるよう-のhrefを=" *「/>すべてのURLがジャンプできます。
`
2.ホワイトリストの設定
`
<アクセス起源=「*」/>ホワイトリストには、すべてのフィールドへのアクセスを許可します

<テント許可-のhref = "HTTP:// * / *" />
<テントが許可-のhref = "HTTPS:// * / *" />
<テント許可-のhref = "*" />は、二つ以上に相当しますOK
`
3.好み
` <プリファレンス名で= "StatusBarStyle"値= "lightcontent" /> `
cordova.jsを識別するために導入された4素性関数
`
<機能名は= "カメラ">
ます。<param name = "IOS-パッケージ"値= "CDVCamera" />
</特集>
`` `
添加した後、cordova.execは、そのようcordova.exec(成功as`正しい対応するネイティブファイルを、見つけることができますが、 '失敗したカメラ'、「getPickerを」、[パラメータ]) `
5. [追加プラグ
` ``
<プラグイン名= "コルドバ・プラグインwkwebview-Engineの"スペック= "^ 1.2.0" />
= "コルドバ・プラグインカメラ" <プラグイン名=仕様"^ 4.1.0" />
<プラグイン名= "デバイス・コルドバ・プラグイン"スペック= "^ 2.0.3" />
`` `
6.追加民間のInfo.plistファイルのパーミッション

*** ***の4.2.2 wkwebviewengine使用するのは簡単
な前提条件:
* iOSのネイティブアプリケーションポッドとプラグイン導入コルドバを
*新HtmlViewControllerなどのViewControllerのCDVViewController、から継承
1.単純なローカル負荷
コルドバの負荷が必要と自身のローカルアプリケーションをH5 HtmlViewControllerのinit初期化スタートページは、のviewDidLoadの前でなければならない変更であり;
CDVViewControllerソースはのviewDidLoadの代わりにウェブページに関連付けられた3つのメソッドを呼び出すため:
` - loadSetting`、` - createGapView`、 ` - appUrl`、およびappUrlデフォルトを設定します。

該当するシーン:
アプリケーション内のアプリケーションH5のzip形式をダウンロードしたら、そのような代替として、ファイルに対応し、それを保存し、解凍し、プロジェクトディレクトリのフォルダ内のWWWのファイルをし、(非連結)を交換アプリケーションとアプリケーションH5にコピーしWWW / index.htmlを、WWW / cordova_plugins.js、WWW / cordova-しようとしている JS-SRC、WWW / cordova.js、WWW /プラグインは、コピーし、次のH5のアプリケーションに。

2.ロードリモートアプリケーション
のUIWebView:ちょうどself.startPageリモートアドレスの下にすることができます設定します。
注意点:
>割り当てself.startPageは[スーパーのviewDidLoad]の前にする必要があり、そうでない場合はself.startPageは暗黙的にインデックスに割り当てられています.htmlを。
>リモートH5をロードするときにそうでない場合は、自動的にブラウザの負荷を開き、設定のconfig.xmlを変更する必要があります。
<許可-ナビゲーションのhref = "HTTPS:// * / *" />
<許可-ナビゲーションのhref = "HTTP:// * / *" />
もcordova.jsファイルで参照>リモートH5。
> Info.plistの中のApp交通のセキュリティ設定の設定を追加します。
wkwebviewengine一見そうすることができない、私は何回かではないしようとしたので、次の方法の使用:
PODは、コルドバ、プラグインwkwebviewengineが導入
HtmlViewController.h修飾
`
の#import <コルドバ/ CDVViewController.h>
の#import <コルドバ/ CDVCommandDelegateImpl.h>

@interface HtmlViewController:CDVViewController

@終わり

@interfaceのCustomWKCommandDelegate:CDVCommandDelegateImpl //コア命令

@終わり

@interfaceのCustomCmdQueue:CDVCommandQueue

@end
`
HtmlViewController.m変更するコンテンツを追加
、` ``
の#import <WebKitの/ WebKit.h>
@interface HtmlViewController()<WKNavigationDelegate>

@終わり

@implementation CustomWKWebViewController

- (ID)INIT {
自己= [スーパーINIT]。
IF(自己){
//重写CDVCommandDelegate
_commandDelegate = [[CustomWKCommandDelegate ALLOC] initWithViewController:自己]。
_commandQueue = [[CustomCmdQueue ALLOC] initWithViewController:自己]。

}
戻りセルフ;
}
- (無効)のviewDidLoad {
[スーパーのviewDidLoad];
追加//セットアップいずれかの操作を行いザ・ビューをロードした後。

スライド支持復帰するので、//、ナビゲーションバーを非表示にすることができます
[self.navigationController setNavigationBarHidden:YESアニメーション:NO ]ありません;

//駆動負荷を使用して
[self.webViewEngine loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@ "https://www.baidu.com"]のCachePolicy:NSURLRequestReloadIgnoringCacheData timeoutInterval:20]です];

}

クロスドメイン// nginxの推奨の場合と同様
DecisionHandler {(ボイド(^)(WKNavigationActionPolicy)):(WKWebView *)のWebView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction DecisionHandler(ボイド)のWebViewを-
//ドメイン間で別々に処理されていません
* = navigationAction.request.URL URL NSURL;
IF([url.schemeとしてisEqualToString:@ "ドメイン名"]){

//このよう開くようにSafariウェブブラウザを使用するなど、クロスドメインリクエストキャンセル、カスタム処理、前に、パラメータであれば、それはスプライスされる
NSDictionaryのをPARAM * = nilを;
IF(@available(iOSの10.0、*)){
[[sharedApplicationのUIApplication]のOpenURL:URLのオプション:のparam CompletionHandler:^(BOOL成功){

}];
}他{
//フォールバックON以前のバージョンで
[[sharedApplicationのUIApplication]のOpenURL:URL];
}

DecisionHandler(WKNavigationActionPolicyCancel); // Web表示をキャンセル
}他{
decisionHandler(WKNavigationActionPolicyAllow)。
}

}

@終わり

@implementation CustomWKCommandDelegate

// - (ID)initWithViewController:(CDVViewController *)のViewController {
//自己= [スーパーinitWithViewController:のViewController]。
//もし(自己){
// self.viewController =のViewController。
//}
自己を返す//;
//}

- (ID)getCommandInstance:(NSStringの*)プラグイン{
戻り[スーパーgetCommandInstance:プラグイン]。
}

//メソッドオーバーライドリソースパス、傍受
- (NSStringの*)pathForResource:(NSStringの*)resourcePath {
// IF(<条件条件#ため#>){
// <#文#>
@}
のNSLog(@「パス--->%の@」、resourcePath);
戻り[スーパーpathForResource:resourcePath];
}

@終わり

@implementation CustomCmdQueue

- (BOOL)を実行する:(CDVInvokedUrlCommand *)コマンド{
[スーパー実行:コマンド]返します。
}

@end
`` `
この理由はCDVViewControllerが自動的にCDVWKWebViewEngineと自動的WKUIDelegate、内のプロキシ機能wkwebviewをロードし、彼らのビジネスロジックを実現することが、書かれている。
該当シーン:ローカルH5アプリケーション、HTML文字列、リモートアプリケーション(と比較した場合WWW小さなファイルは、読み込み速度を向上させるプリロードwkwebviewすることができます)

カスタム挿入部###:
オリジナルのプラグインが需要を満たすことができない、カスタマイズすることが必要である
CDVPLuginネイティブクラスの新しい統合された自己
、変更は対応する機能を実現するために、ネイティブクラスを.Hと.Mを
カスタムプラグイン機能、config.xmlのを修正しますそれに加え
cordova.execによって呼び出すjsが
示唆[Podfile文法(https://www.jianshu.com/p/f841e248bc4f)Aを含むポッドよう、容易な管理、のプラグインの導入

###連続最適化:
WebViewのプリロード、JS \ CSS \画像オフラインキャッシュ、導入無用jsのを避けます。

 

おすすめ

転載: www.cnblogs.com/tony-17/p/11271884.html