SoFunction
Updated on 2024-11-21

IOS ObjectC and javascript interaction details and implementation code

IOS OC and js interaction details

JS Injection : Inject JS code into web pages with OC.

JS injection is also called OC and JS interaction

OC and JS interaction requires a bridge (intermediary), this bridge is the UIWebView proxy method

The page loads the initial content

#import ""

@interface ViewController ()<UIWebViewDelegate>

@property (weak, nonatomic) IBOutlet UIWebView *webView;

@end
- (void)viewDidLoad {
  [super viewDidLoad];
  // Setting up the webView's proxy
   = self;

  // Load web data
  NSURL *URL = [NSURL URLWithString:@"/tuan/deal/5501525"];
//  NSURL *URL = [NSURL URLWithString:@"https:///?tn=93321723_hao_pg"];
  NSURLRequest *request = [NSURLRequest requestWithURL:URL];
  [ loadRequest:request];
}

Change native web page with js in UIWebView's proxy method

/// Proxy method called after the page is loaded : JS Injection : OC calling JS code
- (void)webViewDidFinishLoad:(UIWebView *)webView
{
  // Strings for splicing JS code
  NSMutableString *stringM = [NSMutableString string];

  // Splicing the JS code to remove the top navigation
  [stringM appendString:@"var headerTag = ('header')[0]; (headerTag);"];
  // Splicing in the JS code for removing the orange button
  [stringM appendString:@"var footerBtnTag = ('footer-btn-fix')[0]; (footerBtnTag);"];
  // Splice the JS code that removes the bottom layout
  [stringM appendString:@"var footerTag = ('footer')[0]; (footerTag);"];
  // Splice in the JS code that adds the click event to the img tag.
  [stringM appendString:@"var imgTag = ('figure')[0].children[0];  = function(){=''};"];

  // This method is provided by UIWebView. This method is provided by UIWebView.
  [webView stringByEvaluatingJavaScriptFromString:stringM];
}

Intercept Native Web Requests Page Bounces

 = function(){='‘} 

Send web request when clicking imgTag.

The purpose of the unsolicited web request : is to allow the UIWebView to intercept my custom URLs.

Determine/distinguish whether the label I clicked on is the label I designed by using a custom URL.

Customize the unique URL to indicate that the click is on a unique label.

It's summarized in two steps

Step 1 : JS injects the click event of the label and sends an unsolicited request to a custom URL.

Step 2 : Inside the UIWebView. Intercept the request from the customized URL, and then judge the request.

JS Indirect Calls to OC : JS and OC Interaction

Proxy method to be called when the page is about to start loading : Intercepts all web requests on the webView.

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
  // Get all intercepted requests
  NSString *URLString = ;
  ///?from=1015143h
  //  NSLog(@"%@",URLString);

  if ([URLString isEqualToString:@"/?from=1015143h"]) {
    NSLog(@"I clicked on the imgTag.");

    // Auto-push when I know I'm clicking on an imgTag.
    ///

    NSURL *URL = [NSURL URLWithString:@"/"];
    NSURLRequest *request = [NSURLRequest requestWithURL:URL];
    [ loadRequest:request];
//    TestViewController *testVC = [[TestViewController alloc] init];
//    [ pushViewController:testVC animated:YES];

    // Because this address is invalid. It doesn't need to be loaded.
    return NO;
  }

  // The effect of returning YES: It means that the request you intercepted is allowed to be sent out normally; conversely, the intercepted request is not allowed to be sent out.
  return YES;
}

Thanks for reading, I hope this helps, and thanks for supporting this site!