Captcha:Integrate with the V3 architecture on iOS

In the Controller.swift file of your iOS app project, import the required dependencies.

import WebKit

In the Controller.swift file of your iOS app project, load the HTML5 service page.

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); // Load the page.
}

Set the WKWebView object. Use the WKScriptMessageHandler protocol to enable interaction between JavaScript and WKWebView.

lazy var webView: WKWebView = {
    // Configure adaptive page scaling.
    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;
    // Add the method to call JavaScript from the HTML page. You can change the method name as needed.
    configuration.userContentController.add(self, name: "getCaptchaVerifyParam");
    // Configure WKWebView.
    let webView = WKWebView(frame: self.view.frame, configuration: configuration);
    webView.navigationDelegate = self;
    return webView;
}()

Set the corresponding method for the WKScriptMessageHandler protocol. Use this method to obtain the return value from Captcha 2.0, process it with your service logic, and then return the verification result to a custom API.

func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
    if(messsage.name == "getCaptchaVerifyParam"){
        // After you obtain the signature verification parameters, you can send service or signature verification requests and process the results.
        print(message.body)
    }
}

In the ViewController.m file of your iOS app project, import the required dependencies.

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

@interface ViewController ()<WKScriptMessageHandler>

@property(nonatomic,strong)WKWebView *webView;

@end

In the ViewController.m file of your iOS app project, load the HTML5 service page.

- (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];
}

Set the WKWebView object. Use the WKScriptMessageHandler protocol to enable interaction between JavaScript and WKWebView.

- (WKWebView *)webView{
    if (!_webView) {
        // Configure adaptive page scaling.
        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];
        // Add the method to call JavaScript from the HTML page. The method name must be the same as the one called in the success callback function of the HTML page.
        [userContentController addScriptMessageHandler:self name:@"getCaptchaVerifyParam"];
        // Configure WKWebView.
        WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];
        configuration.userContentController = userContentController;
        // Display WKWebView.
        WKWebView *webView = [[WKWebView alloc] initWithFrame:self.view.frame configuration:configuration];
        webView.backgroundColor = [UIColor blackColor];
        // Enable debug mode (Optional).
        [webView.configuration.preferences setValue:@YES forKey:@"developerExtrasEnabled"];
        webView.inspectable = YES;

        _webView = webView;
    }
    return _webView;
}

Set the corresponding method for the WKScriptMessageHandler protocol. Use this method to obtain the return value from Captcha 2.0, process it with your service logic, and then return the verification result to a custom API.

- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message {
    // Obtain the return value from the Captcha service by calling the corresponding method from the HTML page's JavaScript. The method name must be the same as the one added for the JavaScript call.
    if([message.name isEqualToString:@"getCaptchaVerifyParam"]){
        // After you obtain the signature verification parameters, you can send service or signature verification requests and process the results.
        NSLog(@"Signature verification parameters for Captcha: %@", message.body);
        // You can add your service logic here. For example:
        // 1. Send the signature verification parameters to your server for verification.
        // 2. Process subsequent business flows based on the verification result.
        
        // Example: Send the signature verification parameters to the server.
        [self sendCaptchaVerifyParamToServer:message.body];
    }
}