OC与JS交互简单案例
网页开发中三个重要的知识，这里就不详细介绍了！
- Html：页面代码
- Css：样式
- javascript：响应
先来看一段html的简单代码，里面涉及了上面的三个部分（很简单）
1 <html>
2 <!--描述网页信息-->
3 <head>
4 <meta charset="UTF-8"/>
5 <title>hello world</title>
6 <script>
7 function show()
8 {
9 alert(1);
10 }
11 function showTitle()
12 {
13 alert(document.title);
14 }
15 function repost()
16 {
17 location.href = "http://www.520it.com";
18 }
19 function sum()
20 {
21 eturn 1 + 1;
22 }
23 function btnClick()
24 {
25 location.href = "xmg://call";
26 }
27 </script>
28 </head>
29 <!--网页具体内容-->
30 <body>
31 电话号码: 13554499311</br>
32 邮箱: [email protected]</br>
33 <button style = "background: red; height: 150px; width: 150px;" onclick = "btnClick();">哥是按钮</button>
34 </body>
35
36 </html>
根据上面的代码，我可以简单的实现JS和OC的交互
1:在OC中调用JS，
这里非常简单，一行代码就搞定
只需要在网页加载完成之后的方法webViewDidFinishLoad中使用交互代码实现OC中直接调用JS代码，并且制定对应的JS函数
OC调用JS , 只需要利用UIWebView的stringByEvaluatingJavaScriptFromString方法, 告诉系统需要调用的JS方法名称即可
[self.webView stringByEvaluatingJavaScriptFromString:@"showTitle();"];
2:JS中调用OC代码
根据上面的代码，我在body中实现简单的样式布局和交互的初始化，然后实现交互的函数，在函数里面使用location.href（非常重要）去调用OC代码。
后面要做的就是在OC中实现请求加载的时候去处理相应的功能，其实就是在OC中为JS调用OC构建桥梁
这里知识简单的实现：
- 每次发送请求前都会调用
- 利用该方法作为JS和OC之间的桥梁
- 在JS跳转网页
- 在OC代理方法中通过判断自定义协议头, 决定是否是JS调用OC方法
- 在OC代理方法中通过截取字符串, 获取JS想调用的OC方法名称
1 - (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
2
3 {
4
5 NSLog(@"%@", request.URL);
6
7 /*
8
9 NSString *schem = @"xmg://";
10
11 NSString *urlStr = request.URL.absoluteString;
12
13 if ([urlStr hasPrefix:schem]) {
14
15 NSLog(@"需要调用OC方法");
16
17 // 1.从URL中获取方法名称
18
19 // xmg://call
20
21 NSString *methodName = [urlStr substringFromIndex:schem.length];
22
23 NSLog(@"%@", methodName);
24
25 // 2.调用方法
26
27 SEL sel = NSSelectorFromString(methodName);
28
29 // 忽略警告信息的作用范围开始
30
31 #pragma clang diagnostic push
32
33 // 下面这一行代码是用于指定需要忽略的警告信息
34
35 #pragma clang diagnostic ignored "-Warc-performSelector-leaks"
36
37 [self performSelector:sel withObject:nil];
38
39 // 忽略警告信息的作用范围结束
40
41 #pragma clang diagnostic pop
42
43 return NO;
44
45 }
46
47 */
48
49 /*
50
51 NSString *schem = @"xmg://";
52
53 NSString *urlStr = request.URL.absoluteString;
54
55 if ([urlStr hasPrefix:schem]) {
56
57 NSLog(@"需要调用OC方法");
58
59 // 1.从URL中获取方法名称
60
61 // xmg://callWithNumber_?10086
62
63 NSString *subPath = [urlStr substringFromIndex:schem.length];
64
65 // 注意: 如果指定的用于切割的字符串不存在, 那么就会返回整个字符串
66
67 NSArray *subPaths = [subPath componentsSeparatedByString:@"?"];
68
69 // 2.获取方法名称
70
71 NSString *methodName = [subPaths firstObject];
72
73 methodName = [methodName stringByReplacingOccurrencesOfString:@"_" withString:@":"];
74
75 NSLog(@"%@", methodName);
76
77 // 2.调用方法
78
79 SEL sel = NSSelectorFromString(methodName);
80
81 NSString *parmas = nil;
82
83 if (subPaths.count == 2) {
84
85 parmas = [subPaths lastObject];
86
87 }
88
89 [self performSelector:sel withObject:parmas];
90
91 return NO;
92
93 }
94
95 */
96
97 NSString *schem = @"xmg://";
98
99 NSString *urlStr = request.URL.absoluteString;
100
101 if ([urlStr hasPrefix:schem]) {
102
103 NSLog(@"需要调用OC方法");
104
105 // 1.从URL中获取方法名称
106
107 // xmg://sendMessageWithNumber_andContent_?10086&love
108
109 NSString *subPath = [urlStr substringFromIndex:schem.length];
110
111 // 注意: 如果指定的用于切割的字符串不存在, 那么就会返回整个字符串
112
113 NSArray *subPaths = [subPath componentsSeparatedByString:@"?"];
114
115 // 2.获取方法名称
116
117 NSString *methodName = [subPaths firstObject];
118
119 methodName = [methodName stringByReplacingOccurrencesOfString:@"_" withString:@":"];
120
121 NSLog(@"%@", methodName);
122
123 // 2.调用方法
124
125 SEL sel = NSSelectorFromString(methodName);
126
127
128
129 // 3.处理参数
130
131 NSString *parma = nil;
132
133 if (subPaths.count == 2) {
134
135 parma = [subPaths lastObject];
136
137 // 3.截取参数
138
139 NSArray *parmas = [parma componentsSeparatedByString:@"&"];
140
141 [self performSelector:sel withObject:[parmas firstObject] withObject:[parmas lastObject]];
142
143 return NO;
144
145 }
146
147 //这里处理参数很麻烦，我们可以自己实现一个类去将苹果自带的方法进行优化，其实就是可以传递不同的参数（多个）去处理相应的事件
148
149 [self performSelector:sel withObject:parma];
150
151 return NO;
152
153 }
154
155
156
157 return YES;
158
159 }
调用方法：
1 - (void)call
2 {
3 NSLog(@"%s", __func__);
4 }
5
6 // callWithNumber:
7 - (void)callWithNumber:(NSString *)number
8 {
9 NSLog(@"打电话给%@", number);
10 }
11
12 //sendMessageWithNumber:andContent:
13
14 - (void)sendMessageWithNumber:(NSString *)number andContent:(NSString *)content
15 {
16 NSLog(@"发信息给%@, 内容是%@", number, content);
17 }
18
19 - (void)sendMessageWithNumber:(NSString *)number andContent:(NSString *)content status:(NSString *)status
20 {
21 NSLog(@"发信息给%@, 内容是%@, 发送的状态是%@", number, content, status);
22 }
此时我们就可以在JS中调用OC的时候根据不同需求传递响应的参数
1 function btnClick()
2
3 {
4
5 location.href = "xmg://sendMessageWithNumber_andContent_?10086";
6
7 }
时间： 2024-10-22 23:41:26