>  기사  >  웹 프론트엔드  >  javascript와 IOS ObjectC 간의 상호 작용에 대한 자세한 설명 및 구현 코드

javascript와 IOS ObjectC 간의 상호 작용에 대한 자세한 설명 및 구현 코드

黄舟
黄舟원래의
2017-03-23 15:00:031860검색

이 글은 주로 IOS OC와 js의 상호작용에 대한 자세한 설명과 구현코드를 소개합니다. 필요한 친구들은

IOS 간의 상호작용에 대한 자세한 설명을 참고하세요. OC와 js

JS 주입: OC가 포함된 JS 코드를 웹 페이지에 주입

JS 주입은 OC와 JS의 상호 작용이라고도 합니다

OC와 JS 상호 작용에는 UIWebView의 프록시 메서드인 브리지(중개자)가 필요합니다.

웹 페이지에서 초기 콘텐츠를 로드합니다.

#import "ViewController.h"

@interface ViewController ()<UIWebViewDelegate>

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

@end
- (void)viewDidLoad {
  [super viewDidLoad];
  // 设置webView的代理
  self.webView.delegate = self;

  // 加载网页数据
  NSURL *URL = [NSURL URLWithString:@"http://m.dianping.com/tuan/deal/5501525"];
//  NSURL *URL = [NSURL URLWithString:@"https://www.hao123.com/?tn=93321723_hao_pg"];
  NSURLRequest *request = [NSURLRequest requestWithURL:URL];
  [self.webView loadRequest:request];
}

UIWebView의 프록시 메서드에서 js를 사용하여 네이티브 웹페이지 변경

/// 网页加载完成之后调用的代理方法 : JS注入 : OC调用JS代码
- (void)webViewDidFinishLoad:(UIWebView *)webView
{
  // 用于拼接JS代码的字符串
  NSMutableString *stringM = [NSMutableString string];

  // 拼接移除顶部导航的JS代码
  [stringM appendString:@"var headerTag = document.getElementsByTagName(&#39;header&#39;)[0]; 
  headerTag.parentNode.removeChild(headerTag);"];
  // 拼接移除橙色按钮的JS代码
  [stringM appendString:@"var footerBtnTag = document.getElementsByClassName(&#39;footer-btn-fix&#39;)[0]; 
  footerBtnTag.parentNode.removeChild(footerBtnTag);"];
  // 拼接移除底部布局的JS代码
  [stringM appendString:@"var footerTag = document.getElementsByClassName(&#39;footer&#39;)[0]; 
  footerTag.parentNode.removeChild(footerTag);"];
  // 拼接给img标签添加点击事件的JS代码
  [stringM appendString:@"var imgTag = document.getElementsByTagName(&#39;figure&#39;)[0].children[0]; 
  imgTag.onclick = function(){window.location.href=&#39;https://www.baidu.com&#39;};"];

  // 这个方法就是UIWebView提供的.专门做JS注入的方法
  [webView stringByEvaluatingJavaScriptFromString:stringM];
}

네이티브 네트워크 요청 차단 웹페이지 점프

imgTag.onclick = function(){window.location.href=&#39;https://www.baidu.com‘}

imgTag 클릭 시 적극적으로 네트워크 요청 보내기

네트워크 요청을 적극적으로 보내는 목적 : UIWebView를 활성화하여 사용자 정의 URL을 가로채는 것입니다.

사용자 정의 URL을 사용하여 내가 클릭한 라벨이 내가 디자인한 라벨인지 판단/구별합니다.

고유한 URL을 사용자 정의합니다. , 클릭된 고유 태그

가 두 단계로 요약될 수 있음을 나타냅니다.

첫 번째 단계: JS가 태그의 클릭 이벤트를 삽입하고 적극적으로 사용자 정의 URL 요청 보내기

2단계: UIWebView에서 사용자 정의 URL 요청을 가로채고 요청 확인

JS가 간접적으로 OC 호출: JS 간 상호 작용 및 OC

웹 페이지가 로딩을 시작할 때 호출되는 프록시 메서드: webView에서 모든 네트워크 요청을 가로챌 수 있습니다

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
  // 获取拦截到的所有的请求
  NSString *URLString = request.URL.absoluteString;
  //https://m.baidu.com/?from=1015143h
  //  NSLog(@"%@",URLString);

  if ([URLString isEqualToString:@"https://m.baidu.com/?from=1015143h"]) {
    NSLog(@"我点击的是imgTag");

    // 当我知道点击的是imgTag时,自动push
    //http://www.csdn.net/

    NSURL *URL = [NSURL URLWithString:@"http://www.csdn.net/"];
    NSURLRequest *request = [NSURLRequest requestWithURL:URL];
    [self.webView loadRequest:request];
//    TestViewController *testVC = [[TestViewController alloc] init];
//    [self.navigationController pushViewController:testVC animated:YES];

    // 因为这个地址是无效地址.不需要加载的
    return NO;
  }

  // 返回YES的作用 : 表示你拦截到的请求,允许正常的发送出去;反之,不允许拦截到的请求发送出去
  return YES;
}

위 내용은 javascript와 IOS ObjectC 간의 상호 작용에 대한 자세한 설명 및 구현 코드의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.