web-dev-qa-db-ja.com

iOSアプリでWKWebViewのオリジンを変更する

WKWebViewを中心としたiOSハイブリッドアプリがあり、ローカルWebアセットを loadFileURL で読み込んでいます。 WKWebViewは、HTTPSを介してjQuery.ajaxを使用してバックエンドAPIと通信します。アプリはモバイル専用であり、APIも「モバイル専用」にしたいです。つまり、ChromeやFirefoxなどのブラウザがAPIを使用するのをブロックしたいのです。

私の戦略は、API応答にAccess-Control-Allow-Originヘッダーを次のように設定することです。

Access-Control-Allow-Origin: app://myApp

ブラウザがAPIをクエリしないように、WKWebViewのオリジンをapp://myAppに変更できますか？

javascriptioswkwebview
17
Randomblue

ケース：1

ドキュメントの作成時またはドキュメントの読み込み終了時にJSをWKWebviewに挿入し、カスタム実装でJavaスクリプトXMLHTTPRequestopenメソッドをフックして、すべてのAJAXリクエスト。

サンプルコード

NSString *XMLHTTPRequestHookJSPath = [[NSBundle mainBundle] pathForResource:@"XMLHTTPRequestHook.js" ofType:nil];
    NSString *kXMLHTTPRequestHookJS = [NSString stringWithContentsOfFile:XMLHTTPRequestHookJSPath encoding:NSUTF8StringEncoding error:NULL];
    WKUserContentController *contentController = [[WKUserContentController alloc] init];
    WKUserScript *script = [[WKUserScript alloc] initWithSource:kXMLHTTPRequestHookJS injectionTime:WKUserScriptInjectionTimeAtDocumentEnd forMainFrameOnly:NO];
    [contentController addUserScript:script];
    WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];
    configuration.userContentController = contentController;

    self.lastUsedWebView = [[WKWebView alloc] initWithFrame:self.webContainerView.bounds configuration:configuration];
    self.lastUsedWebView.navigationDelegate = self;

そして、XMLHTTPRequestHook.jsで、XMLHttpRequestをカスタム実装にフックして、このカスタムヘッダーを追加し、元のopenメソッドをコールバックしてみてください。

ケース2 WKWebviewでURLRequestをロードするときにこのヘッダーを追加する場合は、以下のようにこのヘッダーをNSMutableRequestに追加し、このリクエストをWKWebviewにロードできます。ただし、このメソッドでは、WKWebviewからのすべてのAJAX呼び出しにこのヘッダーがない場合があります。

サンプルコード：

WKWebView * webView = /*set up your webView*/
NSMutableURLRequest * request = [NSMutableURLRequest requestWithURL:[NSURL URLWithString:@"http://example.com/index.html"]];
[request addValue:@"app://myApp" forHTTPHeaderField:@"Access-Control-Allow-Origin"];
// use stringWithFormat: in the above line to inject your values programmatically
[webView loadRequest:request];

お役に立てれば。

4
Chandra