@@ -36,54 +36,64 @@ To use a WebViewJavascriptBridge in your own project:
36
36
37
37
2 ) Import the header file and declare an ivar property:
38
38
39
- #import "WebViewJavascriptBridge.h"
39
+ ``` objc
40
+ #import " WebViewJavascriptBridge.h"
41
+ ```
40
42
41
43
...
42
44
43
- @property WebViewJavascriptBridge* bridge;
45
+ ``` objc
46
+ @property WebViewJavascriptBridge* bridge;
47
+ ```
44
48
45
49
3 ) Instantiate WebViewJavascriptBridge with a UIWebView (iOS) or WebView (OSX):
46
50
47
- self.bridge = [WebViewJavascriptBridge bridgeForWebView:webView handler:^(id data, WVJBResponseCallback responseCallback) {
48
- NSLog(@"Received message from javascript: %@", data);
49
- responseCallback(@"Right back atcha");
50
- }];
51
+ ``` objc
52
+ self.bridge = [WebViewJavascriptBridge bridgeForWebView: webView handler:^(id data, WVJBResponseCallback responseCallback) {
53
+ NSLog(@"Received message from javascript: %@", data);
54
+ responseCallback(@"Right back atcha");
55
+ }] ;
56
+ ```
51
57
52
58
4) Go ahead and send some messages from ObjC to javascript:
53
59
54
- [self.bridge send:@"Well hello there"];
55
- [self.bridge send:[NSDictionary dictionaryWithObject:@"Foo" forKey:@"Bar"]];
56
- [self.bridge send:@"Give me a response, will you?" responseCallback:^(id responseData) {
57
- NSLog(@"ObjC got its response! %@", responseData);
58
- }];
60
+ ```objc
61
+ [self.bridge send:@"Well hello there"];
62
+ [self.bridge send:[NSDictionary dictionaryWithObject:@"Foo" forKey:@"Bar"]];
63
+ [self.bridge send:@"Give me a response, will you?" responseCallback:^(id responseData) {
64
+ NSLog(@"ObjC got its response! %@", responseData);
65
+ }];
66
+ ```
59
67
60
68
4 ) Finally, set up the javascript side:
61
69
62
- function connectWebViewJavascriptBridge(callback) {
63
- if (window.WebViewJavascriptBridge) {
70
+ ``` javascript
71
+ function connectWebViewJavascriptBridge (callback ) {
72
+ if (window .WebViewJavascriptBridge ) {
73
+ callback (WebViewJavascriptBridge)
74
+ } else {
75
+ document .addEventListener (' WebViewJavascriptBridgeReady' , function () {
64
76
callback (WebViewJavascriptBridge)
65
- } else {
66
- document.addEventListener('WebViewJavascriptBridgeReady', function() {
67
- callback(WebViewJavascriptBridge)
68
- }, false)
69
- }
77
+ }, false )
70
78
}
79
+ }
80
+
81
+ connectWebViewJavascriptBridge (function (bridge ) {
71
82
72
- connectWebViewJavascriptBridge(function(bridge) {
73
-
74
- /* Init your app here */
75
-
76
- bridge.init(function(message, responseCallback) {
77
- alert('Received message: ' + message)
78
- if (responseCallback) {
79
- responseCallback("Right back atcha")
80
- }
81
- })
82
- bridge.send('Hello from the javascript')
83
- bridge.send('Please respond to this', function responseCallback(responseData) {
84
- console.log("Javascript got its response", responseData)
85
- })
83
+ /* Init your app here */
84
+
85
+ bridge .init (function (message , responseCallback ) {
86
+ alert (' Received message: ' + message)
87
+ if (responseCallback) {
88
+ responseCallback (" Right back atcha" )
89
+ }
86
90
})
91
+ bridge .send (' Hello from the javascript' )
92
+ bridge .send (' Please respond to this' , function responseCallback (responseData ) {
93
+ console .log (" Javascript got its response" , responseData)
94
+ })
95
+ })
96
+ ```
87
97
88
98
WKWebView Support (iOS 8 & OS 10.10)
89
99
------------------------------------
@@ -95,16 +105,18 @@ WebViewJavascriptBridge supports [WKWebView](http://nshipster.com/wkwebkit/) for
95
105
96
106
1 ) Import the header file:
97
107
98
- ```
108
+ ``` objc
99
109
#import " WKWebViewJavascriptBridge.h"
100
110
```
101
111
102
112
2 ) Instantiate WKWebViewJavascriptBridge and with a WKWebView object
103
113
104
- WKWebViewJavascriptBridge* bridge = [WKWebViewJavascriptBridge bridgeForWebView:webView handler:^(id data, WVJBResponseCallback responseCallback) {
105
- NSLog(@"Received message from javascript: %@", data);
106
- responseCallback(@"Right back atcha");
107
- }];
114
+ ``` objc
115
+ WKWebViewJavascriptBridge* bridge = [WKWebViewJavascriptBridge bridgeForWebView: webView handler:^(id data, WVJBResponseCallback responseCallback) {
116
+ NSLog(@"Received message from javascript: %@", data);
117
+ responseCallback(@"Right back atcha");
118
+ }] ;
119
+ ```
108
120
109
121
Contributors & Forks
110
122
--------------------
@@ -127,15 +139,17 @@ The `WVJBResponseCallback` will not be `nil` if the javascript expects a respons
127
139
Optionally, pass in `webViewDelegate:(UIWebViewDelegate*)webViewDelegate` if you need to respond to the [web view's lifecycle events](http://developer.apple.com/library/ios/documentation/uikit/reference/UIWebViewDelegate_Protocol/Reference/Reference.html).
128
140
129
141
Example:
130
-
131
- [ WebViewJavascriptBridge bridgeForWebView: webView handler:^(id data, WVJBResponseCallback responseCallback) {
132
- NSLog(@"Received message from javascript: %@", data);
133
- if (responseCallback) {
134
- responseCallback(@"Right back atcha");
135
- }
136
- }]
137
-
138
- [ WebViewJavascriptBridge bridgeForWebView: webView webViewDelegate: self handler:^(id data, WVJBResponseCallback responseCallback) { /* ... * / }] ;
142
+
143
+ ```objc
144
+ [WebViewJavascriptBridge bridgeForWebView:webView handler:^(id data, WVJBResponseCallback responseCallback) {
145
+ NSLog(@"Received message from javascript: %@", data);
146
+ if (responseCallback) {
147
+ responseCallback(@"Right back atcha");
148
+ }
149
+ }]
150
+
151
+ [WebViewJavascriptBridge bridgeForWebView:webView webViewDelegate:self handler:^(id data, WVJBResponseCallback responseCallback) { /* ... */ }];
152
+ ```
139
153
140
154
##### ` [bridge send:(id)data] `
141
155
##### ` [bridge send:(id)data responseCallback:(WVJBResponseCallback)responseCallback] `
@@ -144,21 +158,25 @@ Send a message to javascript. Optionally expect a response by giving a `response
144
158
145
159
Example:
146
160
147
- [self.bridge send:@"Hi"];
148
- [self.bridge send:[NSDictionary dictionaryWithObject:@"Foo" forKey:@"Bar"]];
149
- [self.bridge send:@"I expect a response!" responseCallback:^(id responseData) {
150
- NSLog(@"Got response! %@", responseData);
151
- }];
161
+ ``` objc
162
+ [self .bridge send: @"Hi"] ;
163
+ [ self.bridge send:[ NSDictionary dictionaryWithObject:@"Foo" forKey:@"Bar"]] ;
164
+ [ self.bridge send:@"I expect a response!" responseCallback:^(id responseData) {
165
+ NSLog(@"Got response! %@", responseData);
166
+ }] ;
167
+ ```
152
168
153
169
##### `[bridge registerHandler:(NSString*)handlerName handler:(WVJBHandler)handler]`
154
170
155
171
Register a handler called `handlerName`. The javascript can then call this handler with `WebViewJavascriptBridge.callHandler("handlerName")`.
156
172
157
173
Example:
158
174
159
- [self.bridge registerHandler:@"getScreenHeight" handler:^(id data, WVJBResponseCallback responseCallback) {
160
- responseCallback([NSNumber numberWithInt:[UIScreen mainScreen].bounds.size.height]);
161
- }];
175
+ ```objc
176
+ [self.bridge registerHandler:@"getScreenHeight" handler:^(id data, WVJBResponseCallback responseCallback) {
177
+ responseCallback([NSNumber numberWithInt:[UIScreen mainScreen].bounds.size.height]);
178
+ }];
179
+ ```
162
180
163
181
##### ` [bridge callHandler:(NSString*)handlerName data:(id)data] `
164
182
##### ` [bridge callHandler:(NSString*)handlerName data:(id)data responseCallback:(WVJBResponseCallback)callback] `
@@ -167,10 +185,12 @@ Call the javascript handler called `handlerName`. Optionally expect a response b
167
185
168
186
Example:
169
187
170
- [self.bridge callHandler:@"showAlert" data:@"Hi from ObjC to JS!"];
171
- [self.bridge callHandler:@"getCurrentPageUrl" data:nil responseCallback:^(id responseData) {
172
- NSLog(@"Current UIWebView page URL is: %@", responseData);
173
- }];
188
+ ``` objc
189
+ [self .bridge callHandler: @"showAlert" data:@"Hi from ObjC to JS!"] ;
190
+ [ self.bridge callHandler:@"getCurrentPageUrl" data: nil responseCallback:^(id responseData) {
191
+ NSLog(@"Current UIWebView page URL is: %@", responseData);
192
+ }] ;
193
+ ```
174
194
175
195
#### Custom bundle
176
196
`WebViewJavascriptBridge` requires `WebViewJavascriptBridge.js.txt` file that is injected into web view to create a bridge on JS side. Standard implementation uses `mainBundle` to search for this file. If you e.g. build a static library and you have that file placed somewhere else you can use this method to specify which bundle should be searched for `WebViewJavascriptBridge.js.txt` file:
@@ -179,8 +199,7 @@ Example:
179
199
180
200
Example:
181
201
182
-
183
- ```
202
+ ```objc
184
203
[WebViewJavascriptBridge bridgeForWebView:_webView
185
204
webViewDelegate:self
186
205
handler:^(id data, WVJBResponseCallback responseCallback) {
@@ -198,10 +217,12 @@ Always wait for the `WebViewJavascriptBridgeReady` DOM event.
198
217
199
218
Example:
200
219
201
- document.addEventListener('WebViewJavascriptBridgeReady', function(event) {
202
- var bridge = event.bridge
203
- // Start using the bridge
204
- }, false)
220
+ ``` javascript
221
+ document .addEventListener (' WebViewJavascriptBridgeReady' , function (event ) {
222
+ var bridge = event .bridge
223
+ // Start using the bridge
224
+ }, false )
225
+ ```
205
226
206
227
##### ` bridge.init(function messageHandler(data, response) { ... }) `
207
228
@@ -213,12 +234,14 @@ The `response` object will be defined if if ObjC sent the message with a `WVJBRe
213
234
214
235
Example:
215
236
216
- bridge.init(function(data, responseCallback) {
217
- alert("Got data " + JSON.stringify(data))
218
- if (responseCallback) {
219
- responseCallback("Right back atcha!")
220
- }
221
- })
237
+ ``` javascript
238
+ bridge .init (function (data , responseCallback ) {
239
+ alert (" Got data " + JSON .stringify (data))
240
+ if (responseCallback) {
241
+ responseCallback (" Right back atcha!" )
242
+ }
243
+ })
244
+ ```
222
245
223
246
##### ` bridge.send("Hi there!") `
224
247
##### ` bridge.send({ Foo:"Bar" }) `
@@ -228,22 +251,25 @@ Send a message to ObjC. Optionally expect a response by giving a `responseCallba
228
251
229
252
Example:
230
253
231
- bridge.send("Hi there!")
232
- bridge.send("Hi there!", function(responseData) {
233
- alert("I got a response! "+JSON.stringify(responseData))
234
- })
254
+ ``` javascript
255
+ bridge .send (" Hi there!" )
256
+ bridge .send (" Hi there!" , function (responseData ) {
257
+ alert (" I got a response! " + JSON .stringify (responseData))
258
+ })
259
+ ```
235
260
236
261
##### ` bridge.registerHandler("handlerName", function(responseData) { ... }) `
237
262
238
263
Register a handler called ` handlerName ` . The ObjC can then call this handler with ` [bridge callHandler:"handlerName" data:@"Foo"] ` and ` [bridge callHandler:"handlerName" data:@"Foo" responseCallback:^(id responseData) { ... }] `
239
264
240
265
Example:
241
266
242
- bridge.registerHandler("showAlert", function(data) { alert(data) })
243
- bridge.registerHandler("getCurrentPageUrl", function(data, responseCallback) {
244
- responseCallback(document.location.toString())
245
- })
246
-
267
+ ``` javascript
268
+ bridge .registerHandler (" showAlert" , function (data ) { alert (data) })
269
+ bridge .registerHandler (" getCurrentPageUrl" , function (data , responseCallback ) {
270
+ responseCallback (document .location .toString ())
271
+ })
272
+ ```
247
273
248
274
iOS4 support (with JSONKit)
249
275
---------------------------
0 commit comments