Captcha:iOS での V3 アーキテクチャとの統合

iOS アプリプロジェクトの Controller.swift ファイルに、必要な依存関係をインポートします。

import WebKit

iOS アプリプロジェクトの Controller.swift ファイルに、HTML5 サービスページを読み込みます。

override func viewDidLoad() {
    super.viewDidLoad()
    view.addSubview(webView)
    let url = URL(string: "http://x.x.x.x/demo/")
    let request = URLRequest(url: url!);
    webView.load(request); // ページを読み込みます。
}

WKWebView オブジェクトを設定します。 WKScriptMessageHandler プロトコルを使用して、JavaScript と WKWebView 間の対話を有効にします。

lazy var webView: WKWebView = {
    // アダプティブページスケーリングを構成します。
    let javascript = "var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width'); document.getElementsByTagName('head')[0].appendChild(meta)";
    let configuration = WKWebViewConfiguration();
    let userScript = WKUserScript(source: javascript, injectionTime: .atDocumentEnd, forMainFrameOnly: true);
    let usercontroller = WKUserContentController();
    usercontroller.addUserScript(userScript);
    configuration.userContentController = usercontroller;
    // HTML ページから JavaScript を呼び出すメソッドを追加します。 必要に応じてメソッド名を変更できます。
    configuration.userContentController.add(self, name: "getCaptchaVerifyParam");
    // WKWebView を構成します。
    let webView = WKWebView(frame: self.view.frame, configuration: configuration);
    webView.navigationDelegate = self;
    return webView;
}()

WKScriptMessageHandler プロトコルに対応するメソッドを設定します。 このメソッドを使用して、Captcha 2.0 からの戻り値を取得し、サービスロジックで処理してから、検証結果をカスタム API に返します。

func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
    if(messsage.name == "getCaptchaVerifyParam"){
        // 署名検証パラメーターを取得した後、サービスリクエストまたは署名検証リクエストを送信して、結果を処理できます。
        print(message.body)
    }
}

iOS アプリプロジェクトの ViewController.m ファイルに、必要な依存関係をインポートします。

#import "ViewController.h"
#import <WebKit/WebKit.h>

@interface ViewController ()<WKScriptMessageHandler>

@property(nonatomic,strong)WKWebView *webView;

@end

iOS アプリプロジェクトの ViewController.m ファイルに、HTML5 サービスページを読み込みます。

- (void)viewDidLoad {
    [super viewDidLoad];
    
    [self.view addSubview:self.webView];
    self.webView.scrollView.backgroundColor = [UIColor redColor];
    
    [self loadLocalHtmlForJs];
}

- (void)loadLocalHtmlForJs{
    NSString *path = [[NSBundle mainBundle] pathForResource:@"index" ofType:@"html"];
    NSURLRequest *req = [NSURLRequest requestWithURL:[NSURL fileURLWithPath:path]];
    [self.webView loadRequest:req];
}

WKWebView オブジェクトを設定します。 WKScriptMessageHandler プロトコルを使用して、JavaScript と WKWebView 間の対話を有効にします。

- (WKWebView *)webView{
    if (!_webView) {
        // アダプティブページスケーリングを構成します。
        NSString *jscript = @"var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width'); document.getElementsByTagName('head')[0].appendChild(meta)";
        WKUserScript *userScript = [[WKUserScript alloc] initWithSource:jscript injectionTime:WKUserScriptInjectionTimeAtDocumentEnd forMainFrameOnly:YES];
        WKUserContentController *userContentController = [[WKUserContentController alloc] init];
        [userContentController addUserScript:userScript];
        // HTML ページから JavaScript を呼び出すメソッドを追加します。 メソッド名は、HTML ページの成功コールバック関数で呼び出されるものと同じである必要があります。
        [userContentController addScriptMessageHandler:self name:@"getCaptchaVerifyParam"];
        // WKWebView を構成します。
        WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];
        configuration.userContentController = userContentController;
        // WKWebView を表示します。
        WKWebView *webView = [[WKWebView alloc] initWithFrame:self.view.frame configuration:configuration];
        webView.backgroundColor = [UIColor blackColor];
        // デバッグモードを有効にします (オプション)。
        [webView.configuration.preferences setValue:@YES forKey:@"developerExtrasEnabled"];
        webView.inspectable = YES;

        _webView = webView;
    }
    return _webView;
}

WKScriptMessageHandler プロトコルに対応するメソッドを設定します。 このメソッドを使用して、Captcha 2.0 からの戻り値を取得し、サービスロジックで処理してから、検証結果をカスタム API に返します。

- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message {
    // HTML ページの JavaScript から対応するメソッドを呼び出して、Captcha サービスからの戻り値を取得します。 メソッド名は、JavaScript 呼び出し用に追加されたものと同じである必要があります。
    if([message.name isEqualToString:@"getCaptchaVerifyParam"]){
        // 署名検証パラメーターを取得した後、サービスまたは署名検証リクエストを送信して結果を処理できます。
        NSLog(@"Captcha の署名検証パラメーター: %@", message.body);
        // ここにサービスロジックを追加できます。 例:
        // 1. 署名検証パラメーターをサーバーに送信して検証します。
        // 2. 検証結果に基づいて後続のビジネスフローを処理します。
        
        // 例: 署名検証パラメーターをサーバーに送信します。
        [self sendCaptchaVerifyParamToServer:message.body];
    }
}