iOS与JavaScript交互总结

时间 2019-11-13

原文原文链接

最近因为公司业务须要，须要在移动端调用JS去解析大众点评网页，同时抓取评论相关内容。对iOS与JS交互进行了研究，总结一下。javascript

技术点总结：html

首先，OC与JS的交互须要用到UIWebView来实现。java

技术点一：OC调用JS方法。jquery

这个其实在苹果API中已经集成的很好了，只须要一个方法stringByEvaluatingJavaScriptFromString 就能够了，去API中查看它是UIWebView的对象方法，须要传入的参数为NSString,这个字符串是所调用的JS方法的方法名。该方法的返回值一样是一个字符串，为JS方法的返回值。ios

技术点二：JS调用OC方法web

这个用到了WebView的代理方法app

- (BOOL)webView:(UIWebView*)webView shouldStartLoadWithRequest:(NSURLRequest*)request navigationType:(UIWebViewNavigationType)navigationType;函数

网页加载每个请求的时候都会调用这个方法，你能够在JS中加载一个伪URL请求，实际上是事先协商好格式的字符串，这样在iOS只须要解析这个请求，若是发现是事先协商好的格式的请求，那么你就能够去调用对应的方法了。ui

原理相对来讲仍是比较简单的，说说再具体实现中遇到的几个坑点。编码

坑点总结：

坑点一：由于须要把抓取到的大众点评的网页传给JS方法，可是JS方法传入参数长度大于480时就接收不到参数，具体缘由不明。

解决方法：for循环屡次调用这个方法，每次传入480，用一个JS方法专门去接收并拼接成整个网页的字符串。

坑点二：因为以上for循环上传html，可能恰好截到某些敏感的字符。

解决方法：以前是先总体转义好的，截取时碰到仍是有可能碰到一些敏感字符，因此先截取再转义。那么截取的长度就须要稍微短一些，由于转义完的字符仍是不能超过480。

坑点三：这个主要是JS的问题，返回的字符为ASCII加密格式，一直在移动端解析不出来。

解决方法：只需在JS返回参数是用encodeURIComponent这个方法进行一下编码就能够了。

坑点四：大众点评的网页相同网址在电脑端访问自动是电脑版，手机端自动是手机版，而手机版的评论条数比较少，这就须要咱们去用手机端去访问到电脑版的网页。

解决方法：须要将手机的UserAgent设置为电脑端便可。

坑点五：像上面那样设置了UserAgent，可是在其余页面还须要展现手机端的网页，还须要在离开这个界面的时候将userAgent设置回去。

为了清楚将代码放在下方：

iOS代码：

#import "ViewController.h"

#define kPCUserAgent @"Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.7 Safari/537.36"

#define kAppUserAgent @"Mozilla/5.0 (iPhone; U; CPU like Mac OS X; en) AppleWebKit/420+ (KHTML, like Gecko) Version/3.0 Mobile/1C28 Safari/419.3"

@interface ViewController ()<UIWebViewDelegate>

{

UIWebView *myWebView;

}

@end

@implementation ViewController

- (void)viewWillDisappear:(BOOL)animated

{

[super viewWillDisappear:animated];

// 确保在访问别的点评网页时是手机版

[[NSUserDefaults standardUserDefaults]registerDefaults:@{@"UserAgent":kAppUserAgent}];

}

- (void)viewDidLoad {

[super viewDidLoad];

myWebView = [[UIWebView alloc]initWithFrame:CGRectMake(0, 0,320, 658)];

myWebView.delegate = self;

myWebView.autoresizingMask = UIViewAutoresizingFlexibleWidth| UIViewAutoresizingFlexibleHeight;

myWebView.scalesPageToFit = YES;

NSURLRequest *request= [NSURLRequest requestWithURL:[NSURL URLWithString:@"http://p.test.aijee.cn/CApp1_4_5/changedpcomment"]];

[myWebView loadRequest:request];

[self.view addSubview:myWebView];

[[NSUserDefaults standardUserDefaults]registerDefaults:@{@"UserAgent":kPCUserAgent}];

// @"http://p.test.aijee.cn/CApp1_4_5/changedpcomment"

}

- (void)webViewDidFinishLoad:(UIWebView *)webView

{

//网页加载完成调用此方法

if (webView == myWebView) {

NSString *url =@"http://www.dianping.com/shop/4739340/";

NSString *appConnect = [[NSString alloc] initWithContentsOfURL:[NSURL URLWithString:url] encoding:NSUTF8StringEncoding error:nil];

for (int i = 0; i < appConnect.length / 300 + 1; i++) {

NSRange range;

if (i == appConnect.length / 300) {

range = NSMakeRange(i * 300, appConnect.length - i * 300);

} else {

range = NSMakeRange(i * 300,300);

}

NSString *appContentString = [appConnect substringWithRange:range];

appContentString = [appContentString stringByReplacingOccurrencesOfString:@"\r" withString:@""];

appContentString = [appContentString stringByReplacingOccurrencesOfString:@"\n" withString:@""];

appContentString = [appContentString stringByReplacingOccurrencesOfString:@"\"" withString:@"\\\""];

appContentString = [appContentString stringByReplacingOccurrencesOfString:@"/" withString:@"\\/"];

NSString *string = [NSString stringWithFormat:@"changedpcomment('%@')",appContentString];

[webView stringByEvaluatingJavaScriptFromString:string];

}

NSString *string = [webView stringByEvaluatingJavaScriptFromString:@"changedpcomment2()"];

NSString *decodeString = [self decodeFromPercentEscapeString:string];

NSLog(@"result = %@",decodeString);

NSData *dataString = [decodeString dataUsingEncoding:NSUTF8StringEncoding];

NSArray *array = [NSJSONSerializationJSONObjectWithData:dataString options:NSJSONReadingAllowFragments error:nil];

NSLog(@"array = %@",array);

}

- (BOOL)webView:(UIWebView*)webView shouldStartLoadWithRequest:(NSURLRequest*)request navigationType:(UIWebViewNavigationType)navigationType

{

NSString *urlString = [[request URL] absoluteString];

urlString = [urlString stringByReplacingPercentEscapesUsingEncoding:NSUTF8StringEncoding];

NSLog(@"urlString=%@",urlString);

NSArray *urlComps = [urlString componentsSeparatedByString:@"://"];

if([urlComps count] && [[urlComps objectAtIndex:0] isEqualToString:@"objc"])

{

NSArray *arrFucnameAndParameter = [(NSString*)[urlCompsobjectAtIndex:1] componentsSeparatedByString:@":/"];

NSString *funcStr = [arrFucnameAndParameter objectAtIndex:0];

if (1 == [arrFucnameAndParameter count])

{

// 没有参数

if([funcStr isEqualToString:@"doFunc1"])

{

/*调用本地函数1*/

NSLog(@"doFunc1");

}

else

{

//有参数的

if([funcStrisEqualToString:@"getParam1:withParam2:"])

{

[self getParam1:[arrFucnameAndParameter objectAtIndex:1] withParam2:[arrFucnameAndParameter objectAtIndex:2]];

}

return NO;

}

return YES;

}

- (void)getParam1:(NSString*)str1 withParam2:(NSString*)str2

{

NSLog(@"收到html传过来的参数：str1=%@,str2=%@",str1,str2);

}

- (void)didReceiveMemoryWarning {

[super didReceiveMemoryWarning];

// Dispose of any resources that can be recreated.

}

@end

JS代码：

<html>

<head>

<title>js调用oc</title>

</script>

</head>

<body>

<!--

</body>

-->

</textarea>

</body>

//处理html 获取评论

var aa = ""; // 全局变量用于接收所有的html

// 获取所有html的方法

function changedpcomment(html){

aa=aa+html;

}

// 具体去解析html的方法

function changedpcomment2(){

return encodeURIComponent(newData); // 将解析好的数据编好码返回给OC

}

// 点击按钮，调用OC方法

function testClick(cmd)

{

var str1=document.getElementById("text1").value;

var str2=document.getElementById("text2").value;

window.location.href="objc://"+cmd+":/"+EncodeUtf8(str1)+":/"+EncodeUtf8(str2);

}

</script>

</html>