Captcha:Integrasi dengan Arsitektur V3 di iOS

Dalam file Controller.swift proyek aplikasi iOS Anda, impor dependensi yang diperlukan.

import WebKit

Dalam file Controller.swift proyek aplikasi iOS Anda, muat halaman layanan 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); // Muat halaman.
}

Atur objek WKWebView. Gunakan protokol WKScriptMessageHandler untuk mengaktifkan interaksi antara JavaScript dan WKWebView.

lazy var webView: WKWebView = {
    // Konfigurasikan penskalaan halaman adaptif.
    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;
    // Tambahkan metode untuk memanggil JavaScript dari halaman HTML. Anda dapat mengubah nama metode sesuai kebutuhan.
    configuration.userContentController.add(self, name: "getCaptchaVerifyParam");
    // Konfigurasikan WKWebView.
    let webView = WKWebView(frame: self.view.frame, configuration: configuration);
    webView.navigationDelegate = self;
    return webView;
}()

Atur metode yang sesuai untuk protokol WKScriptMessageHandler. Gunakan metode ini untuk mendapatkan nilai kembali dari Captcha 2.0, proses dengan logika layanan Anda, dan kembalikan hasil verifikasi ke API kustom.

func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
    if(messsage.name == "getCaptchaVerifyParam"){
        // Setelah Anda mendapatkan parameter verifikasi tanda tangan, Anda dapat mengirim permintaan layanan atau verifikasi tanda tangan dan memproses hasilnya.
        print(message.body)
    }
}

Dalam file ViewController.m proyek aplikasi iOS Anda, impor dependensi yang diperlukan.

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

@interface ViewController ()<WKScriptMessageHandler>

@property(nonatomic,strong)WKWebView *webView;

@end

Dalam file ViewController.m proyek aplikasi iOS Anda, muat halaman layanan 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];
}

Atur objek WKWebView. Gunakan protokol WKScriptMessageHandler untuk mengaktifkan interaksi antara JavaScript dan WKWebView.

- (WKWebView *)webView{
    if (!_webView) {
        // Konfigurasikan penskalaan halaman adaptif.
        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];
        // Tambahkan metode untuk memanggil JavaScript dari halaman HTML. Nama metode harus sama dengan yang dipanggil dalam fungsi callback sukses halaman HTML.
        [userContentController addScriptMessageHandler:self name:@"getCaptchaVerifyParam"];
        // Konfigurasikan WKWebView.
        WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];
        configuration.userContentController = userContentController;
        // Tampilkan WKWebView.
        WKWebView *webView = [[WKWebView alloc] initWithFrame:self.view.frame configuration:configuration];
        webView.backgroundColor = [UIColor blackColor];
        // Aktifkan mode debug (Opsional).
        [webView.configuration.preferences setValue:@YES forKey:@"developerExtrasEnabled"];
        webView.inspectable = YES;

        _webView = webView;
    }
    return _webView;
}

Atur metode yang sesuai untuk protokol WKScriptMessageHandler. Gunakan metode ini untuk mendapatkan nilai kembali dari Captcha 2.0, proses dengan logika layanan Anda, dan kembalikan hasil verifikasi ke API kustom.

- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message {
    // Dapatkan nilai kembali dari layanan Captcha dengan memanggil metode yang sesuai dari JavaScript halaman HTML. Nama metode harus sama dengan yang ditambahkan untuk pemanggilan JavaScript.
    if([message.name isEqualToString:@"getCaptchaVerifyParam"]){
        // Setelah Anda mendapatkan parameter verifikasi tanda tangan, Anda dapat mengirim permintaan layanan atau verifikasi tanda tangan dan memproses hasilnya.
        NSLog(@"Parameter verifikasi tanda tangan untuk Captcha: %@", message.body);
        // Anda dapat menambahkan logika layanan Anda di sini. Contohnya:
        // 1. Kirim parameter verifikasi tanda tangan ke server Anda untuk diverifikasi.
        // 2. Proses alur bisnis berikutnya berdasarkan hasil verifikasi.
        
        // Contoh: Kirim parameter verifikasi tanda tangan ke server.
        [self sendCaptchaVerifyParamToServer:message.body];
    }
}