UNPKG

26.5 kBMarkdownView Raw
1---
2title: Inappbrowser
3description: Open an in-app browser window.
4---
5<!--
6# license: Licensed to the Apache Software Foundation (ASF) under one
7# or more contributor license agreements. See the NOTICE file
8# distributed with this work for additional information
9# regarding copyright ownership. The ASF licenses this file
10# to you under the Apache License, Version 2.0 (the
11# "License"); you may not use this file except in compliance
12# with the License. You may obtain a copy of the License at
13#
14# http://www.apache.org/licenses/LICENSE-2.0
15#
16# Unless required by applicable law or agreed to in writing,
17# software distributed under the License is distributed on an
18# "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
19# KIND, either express or implied. See the License for the
20# specific language governing permissions and limitations
21# under the License.
22-->
23
24|Android|iOS| Windows 8.1 Store | Windows 8.1 Phone | Windows 10 Store | Travis CI |
25|:-:|:-:|:-:|:-:|:-:|:-:|
26|[![Build Status](http://cordova-ci.cloudapp.net:8080/buildStatus/icon?job=cordova-periodic-build/PLATFORM=android,PLUGIN=cordova-plugin-inappbrowser)](http://cordova-ci.cloudapp.net:8080/job/cordova-periodic-build/PLATFORM=android,PLUGIN=cordova-plugin-inappbrowser/)|[![Build Status](http://cordova-ci.cloudapp.net:8080/buildStatus/icon?job=cordova-periodic-build/PLATFORM=ios,PLUGIN=cordova-plugin-inappbrowser)](http://cordova-ci.cloudapp.net:8080/job/cordova-periodic-build/PLATFORM=ios,PLUGIN=cordova-plugin-inappbrowser/)|[![Build Status](http://cordova-ci.cloudapp.net:8080/buildStatus/icon?job=cordova-periodic-build/PLATFORM=windows-8.1-store,PLUGIN=cordova-plugin-inappbrowser)](http://cordova-ci.cloudapp.net:8080/job/cordova-periodic-build/PLATFORM=windows-8.1-store,PLUGIN=cordova-plugin-inappbrowser/)|[![Build Status](http://cordova-ci.cloudapp.net:8080/buildStatus/icon?job=cordova-periodic-build/PLATFORM=windows-8.1-phone,PLUGIN=cordova-plugin-inappbrowser)](http://cordova-ci.cloudapp.net:8080/job/cordova-periodic-build/PLATFORM=windows-8.1-phone,PLUGIN=cordova-plugin-inappbrowser/)|[![Build Status](http://cordova-ci.cloudapp.net:8080/buildStatus/icon?job=cordova-periodic-build/PLATFORM=windows-10-store,PLUGIN=cordova-plugin-inappbrowser)](http://cordova-ci.cloudapp.net:8080/job/cordova-periodic-build/PLATFORM=windows-10-store,PLUGIN=cordova-plugin-inappbrowser/)|[![Build Status](https://travis-ci.org/apache/cordova-plugin-inappbrowser.svg?branch=master)](https://travis-ci.org/apache/cordova-plugin-inappbrowser)|
27
28# cordova-plugin-inappbrowser
29
30You can show helpful articles, videos, and web resources inside of your app. Users can view web pages without leaving your app.
31
32> To get a few ideas, check out the [sample](#sample) at the bottom of this page or go straight to the [reference](#reference) content.
33
34This plugin provides a web browser view that displays when calling `cordova.InAppBrowser.open()`.
35
36 var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
37
38The `cordova.InAppBrowser.open()` function is defined to be a drop-in replacement
39for the `window.open()` function. Existing `window.open()` calls can use the
40InAppBrowser window, by replacing window.open:
41
42 window.open = cordova.InAppBrowser.open;
43
44The InAppBrowser window behaves like a standard web browser,
45and can't access Cordova APIs. For this reason, the InAppBrowser is recommended
46if you need to load third-party (untrusted) content, instead of loading that
47into the main Cordova webview. The InAppBrowser is not subject to the
48whitelist, nor is opening links in the system browser.
49
50The InAppBrowser provides by default its own GUI controls for the user (back,
51forward, done).
52
53For backwards compatibility, this plugin also hooks `window.open`.
54However, the plugin-installed hook of `window.open` can have unintended side
55effects (especially if this plugin is included only as a dependency of another
56plugin). The hook of `window.open` will be removed in a future major release.
57Until the hook is removed from the plugin, apps can manually restore the default
58behaviour:
59
60 delete window.open // Reverts the call back to it's prototype's default
61
62Although `window.open` is in the global scope, InAppBrowser is not available until after the `deviceready` event.
63
64 document.addEventListener("deviceready", onDeviceReady, false);
65 function onDeviceReady() {
66 console.log("window.open works well");
67 }
68
69Report issues with this plugin on the [Apache Cordova issue tracker](https://issues.apache.org/jira/issues/?jql=project%20%3D%20CB%20AND%20status%20in%20%28Open%2C%20%22In%20Progress%22%2C%20Reopened%29%20AND%20resolution%20%3D%20Unresolved%20AND%20component%20%3D%20%22Plugin%20InAppBrowser%22%20ORDER%20BY%20priority%20DESC%2C%20summary%20ASC%2C%20updatedDate%20DESC)
70
71
72## <a id="reference">Reference
73## Installation
74
75 cordova plugin add cordova-plugin-inappbrowser
76
77If you want all page loads in your app to go through the InAppBrowser, you can
78simply hook `window.open` during initialization. For example:
79
80 document.addEventListener("deviceready", onDeviceReady, false);
81 function onDeviceReady() {
82 window.open = cordova.InAppBrowser.open;
83 }
84
85## cordova.InAppBrowser.open
86
87Opens a URL in a new `InAppBrowser` instance, the current browser
88instance, or the system browser.
89
90 var ref = cordova.InAppBrowser.open(url, target, options);
91
92- __ref__: Reference to the `InAppBrowser` window when the target is set to `'_blank'`. _(InAppBrowser)_
93
94- __url__: The URL to load _(String)_. Call `encodeURI()` on this if the URL contains Unicode characters.
95
96- __target__: The target in which to load the URL, an optional parameter that defaults to `_self`. _(String)_
97
98 - `_self`: Opens in the Cordova WebView if the URL is in the white list, otherwise it opens in the `InAppBrowser`.
99 - `_blank`: Opens in the `InAppBrowser`.
100 - `_system`: Opens in the system's web browser.
101
102- __options__: Options for the `InAppBrowser`. Optional, defaulting to: `location=yes`. _(String)_
103
104 The `options` string must not contain any blank space, and each feature's name/value pairs must be separated by a comma. Feature names are case insensitive. All platforms support the value below:
105
106 - __location__: Set to `yes` or `no` to turn the `InAppBrowser`'s location bar on or off.
107
108 Android only:
109
110 - __hidden__: set to `yes` to create the browser and load the page, but not show it. The loadstop event fires when loading is complete. Omit or set to `no` (default) to have the browser open and load normally.
111 - __clearcache__: set to `yes` to have the browser's cookie cache cleared before the new window is opened
112 - __clearsessioncache__: set to `yes` to have the session cookie cache cleared before the new window is opened
113 - __zoom__: set to `yes` to show Android browser's zoom controls, set to `no` to hide them. Default value is `yes`.
114 - __hardwareback__: set to `yes` to use the hardware back button to navigate backwards through the `InAppBrowser`'s history. If there is no previous page, the `InAppBrowser` will close. The default value is `yes`, so you must set it to `no` if you want the back button to simply close the InAppBrowser.
115 - __mediaPlaybackRequiresUserAction__: Set to `yes` to prevent HTML5 audio or video from autoplaying (defaults to `no`).
116 - __shouldPauseOnSuspend__: Set to `yes` to make InAppBrowser WebView to pause/resume with the app to stop background audio (this may be required to avoid Google Play issues like described in [CB-11013](https://issues.apache.org/jira/browse/CB-11013)).
117
118 iOS only:
119
120 - __closebuttoncaption__: set to a string to use as the __Done__ button's caption. Note that you need to localize this value yourself.
121 - __disallowoverscroll__: Set to `yes` or `no` (default is `no`). Turns on/off the UIWebViewBounce property.
122 - __hidden__: set to `yes` to create the browser and load the page, but not show it. The loadstop event fires when loading is complete. Omit or set to `no` (default) to have the browser open and load normally.
123 - __clearcache__: set to `yes` to have the browser's cookie cache cleared before the new window is opened
124 - __clearsessioncache__: set to `yes` to have the session cookie cache cleared before the new window is opened
125 - __toolbar__: set to `yes` or `no` to turn the toolbar on or off for the InAppBrowser (defaults to `yes`)
126 - __enableViewportScale__: Set to `yes` or `no` to prevent viewport scaling through a meta tag (defaults to `no`).
127 - __mediaPlaybackRequiresUserAction__: Set to `yes` to prevent HTML5 audio or video from autoplaying (defaults to `no`).
128 - __allowInlineMediaPlayback__: Set to `yes` or `no` to allow in-line HTML5 media playback, displaying within the browser window rather than a device-specific playback interface. The HTML's `video` element must also include the `webkit-playsinline` attribute (defaults to `no`)
129 - __keyboardDisplayRequiresUserAction__: Set to `yes` or `no` to open the keyboard when form elements receive focus via JavaScript's `focus()` call (defaults to `yes`).
130 - __suppressesIncrementalRendering__: Set to `yes` or `no` to wait until all new view content is received before being rendered (defaults to `no`).
131 - __presentationstyle__: Set to `pagesheet`, `formsheet` or `fullscreen` to set the [presentation style](http://developer.apple.com/library/ios/documentation/UIKit/Reference/UIViewController_Class/Reference/Reference.html#//apple_ref/occ/instp/UIViewController/modalPresentationStyle) (defaults to `fullscreen`).
132 - __transitionstyle__: Set to `fliphorizontal`, `crossdissolve` or `coververtical` to set the [transition style](http://developer.apple.com/library/ios/#documentation/UIKit/Reference/UIViewController_Class/Reference/Reference.html#//apple_ref/occ/instp/UIViewController/modalTransitionStyle) (defaults to `coververtical`).
133 - __toolbarposition__: Set to `top` or `bottom` (default is `bottom`). Causes the toolbar to be at the top or bottom of the window.
134
135 Windows only:
136
137 - __hidden__: set to `yes` to create the browser and load the page, but not show it. The loadstop event fires when loading is complete. Omit or set to `no` (default) to have the browser open and load normally.
138 - __fullscreen__: set to `yes` to create the browser control without a border around it. Please note that if __location=no__ is also specified, there will be no control presented to user to close IAB window.
139 - __hardwareback__: works the same way as on Android platform.
140
141### Supported Platforms
142
143- Amazon Fire OS
144- Android
145- BlackBerry 10
146- Firefox OS
147- iOS
148- Windows 8 and 8.1
149- Windows Phone 7 and 8
150- Browser
151
152### Example
153
154 var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
155 var ref2 = cordova.InAppBrowser.open(encodeURI('http://ja.m.wikipedia.org/wiki/ハングル'), '_blank', 'location=yes');
156
157### Firefox OS Quirks
158
159As plugin doesn't enforce any design there is a need to add some CSS rules if
160opened with `target='_blank'`. The rules might look like these
161
162``` css
163.inAppBrowserWrap {
164 background-color: rgba(0,0,0,0.75);
165 color: rgba(235,235,235,1.0);
166}
167.inAppBrowserWrap menu {
168 overflow: auto;
169 list-style-type: none;
170 padding-left: 0;
171}
172.inAppBrowserWrap menu li {
173 font-size: 25px;
174 height: 25px;
175 float: left;
176 margin: 0 10px;
177 padding: 3px 10px;
178 text-decoration: none;
179 color: #ccc;
180 display: block;
181 background: rgba(30,30,30,0.50);
182}
183.inAppBrowserWrap menu li.disabled {
184 color: #777;
185}
186```
187
188### Windows Quirks
189
190Windows 8.0, 8.1 and Windows Phone 8.1 don't support remote urls to be opened in the Cordova WebView so remote urls are always showed in the system's web browser if opened with `target='_self'`.
191
192On Windows 10 if the URL is NOT in the white list and is opened with `target='_self'` it will be showed in the system's web browser instead of InAppBrowser popup.
193
194Similar to Firefox OS IAB window visual behaviour can be overridden via `inAppBrowserWrap`/`inAppBrowserWrapFullscreen` CSS classes
195
196### Browser Quirks
197
198- Plugin is implemented via iframe,
199
200- Navigation history (`back` and `forward` buttons in LocationBar) is not implemented.
201
202## InAppBrowser
203
204The object returned from a call to `cordova.InAppBrowser.open` when the target is set to `'_blank'`.
205
206### Methods
207
208- addEventListener
209- removeEventListener
210- close
211- show
212- executeScript
213- insertCSS
214
215## InAppBrowser.addEventListener
216
217> Adds a listener for an event from the `InAppBrowser`.
218
219 ref.addEventListener(eventname, callback);
220
221- __ref__: reference to the `InAppBrowser` window _(InAppBrowser)_
222
223- __eventname__: the event to listen for _(String)_
224
225 - __loadstart__: event fires when the `InAppBrowser` starts to load a URL.
226 - __loadstop__: event fires when the `InAppBrowser` finishes loading a URL.
227 - __loaderror__: event fires when the `InAppBrowser` encounters an error when loading a URL.
228 - __exit__: event fires when the `InAppBrowser` window is closed.
229
230- __callback__: the function that executes when the event fires. The function is passed an `InAppBrowserEvent` object as a parameter.
231
232## Example
233
234```javascript
235
236var inAppBrowserRef;
237
238function showHelp(url) {
239
240 var target = "_blank";
241
242 var options = "location=yes,hidden=yes";
243
244 inAppBrowserRef = cordova.InAppBrowser.open(url, target, options);
245
246 inAppBrowserRef.addEventListener('loadstart', loadStartCallBack);
247
248 inAppBrowserRef.addEventListener('loadstop', loadStopCallBack);
249
250 inAppBrowserRef.addEventListener('loaderror', loadErrorCallBack);
251
252}
253
254function loadStartCallBack() {
255
256 $('#status-message').text("loading please wait ...");
257
258}
259
260function loadStopCallBack() {
261
262 if (inAppBrowserRef != undefined) {
263
264 inAppBrowserRef.insertCSS({ code: "body{font-size: 25px;" });
265
266 $('#status-message').text("");
267
268 inAppBrowserRef.show();
269 }
270
271}
272
273function loadErrorCallBack(params) {
274
275 $('#status-message').text("");
276
277 var scriptErrorMesssage =
278 "alert('Sorry we cannot open that page. Message from the server is : "
279 + params.message + "');"
280
281 inAppBrowserRef.executeScript({ code: scriptErrorMesssage }, executeScriptCallBack);
282
283 inAppBrowserRef.close();
284
285 inAppBrowserRef = undefined;
286
287}
288
289function executeScriptCallBack(params) {
290
291 if (params[0] == null) {
292
293 $('#status-message').text(
294 "Sorry we couldn't open that page. Message from the server is : '"
295 + params.message + "'");
296 }
297
298}
299
300```
301
302### InAppBrowserEvent Properties
303
304- __type__: the eventname, either `loadstart`, `loadstop`, `loaderror`, or `exit`. _(String)_
305
306- __url__: the URL that was loaded. _(String)_
307
308- __code__: the error code, only in the case of `loaderror`. _(Number)_
309
310- __message__: the error message, only in the case of `loaderror`. _(String)_
311
312
313### Supported Platforms
314
315- Amazon Fire OS
316- Android
317- iOS
318- Windows 8 and 8.1
319- Windows Phone 7 and 8
320- Browser
321
322### Browser Quirks
323
324`loadstart` and `loaderror` events are not being fired.
325
326### Quick Example
327
328 var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
329 ref.addEventListener('loadstart', function(event) { alert(event.url); });
330
331## InAppBrowser.removeEventListener
332
333> Removes a listener for an event from the `InAppBrowser`.
334
335 ref.removeEventListener(eventname, callback);
336
337- __ref__: reference to the `InAppBrowser` window. _(InAppBrowser)_
338
339- __eventname__: the event to stop listening for. _(String)_
340
341 - __loadstart__: event fires when the `InAppBrowser` starts to load a URL.
342 - __loadstop__: event fires when the `InAppBrowser` finishes loading a URL.
343 - __loaderror__: event fires when the `InAppBrowser` encounters an error loading a URL.
344 - __exit__: event fires when the `InAppBrowser` window is closed.
345
346- __callback__: the function to execute when the event fires.
347The function is passed an `InAppBrowserEvent` object.
348
349### Supported Platforms
350
351- Amazon Fire OS
352- Android
353- iOS
354- Windows 8 and 8.1
355- Windows Phone 7 and 8
356- Browser
357
358### Quick Example
359
360 var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
361 var myCallback = function(event) { alert(event.url); }
362 ref.addEventListener('loadstart', myCallback);
363 ref.removeEventListener('loadstart', myCallback);
364
365## InAppBrowser.close
366
367> Closes the `InAppBrowser` window.
368
369 ref.close();
370
371- __ref__: reference to the `InAppBrowser` window _(InAppBrowser)_
372
373### Supported Platforms
374
375- Amazon Fire OS
376- Android
377- Firefox OS
378- iOS
379- Windows 8 and 8.1
380- Windows Phone 7 and 8
381- Browser
382
383### Quick Example
384
385 var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
386 ref.close();
387
388## InAppBrowser.show
389
390> Displays an InAppBrowser window that was opened hidden. Calling this has no effect if the InAppBrowser was already visible.
391
392 ref.show();
393
394- __ref__: reference to the InAppBrowser window (`InAppBrowser`)
395
396### Supported Platforms
397
398- Amazon Fire OS
399- Android
400- iOS
401- Windows 8 and 8.1
402- Browser
403
404### Quick Example
405
406 var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'hidden=yes');
407 // some time later...
408 ref.show();
409
410## InAppBrowser.executeScript
411
412> Injects JavaScript code into the `InAppBrowser` window
413
414 ref.executeScript(details, callback);
415
416- __ref__: reference to the `InAppBrowser` window. _(InAppBrowser)_
417
418- __injectDetails__: details of the script to run, specifying either a `file` or `code` key. _(Object)_
419 - __file__: URL of the script to inject.
420 - __code__: Text of the script to inject.
421
422- __callback__: the function that executes after the JavaScript code is injected.
423 - If the injected script is of type `code`, the callback executes
424 with a single parameter, which is the return value of the
425 script, wrapped in an `Array`. For multi-line scripts, this is
426 the return value of the last statement, or the last expression
427 evaluated.
428
429### Supported Platforms
430
431- Amazon Fire OS
432- Android
433- iOS
434- Windows 8 and 8.1
435- Browser
436
437### Quick Example
438
439 var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
440 ref.addEventListener('loadstop', function() {
441 ref.executeScript({file: "myscript.js"});
442 });
443
444### Browser Quirks
445
446- only __code__ key is supported.
447
448### Windows Quirks
449
450Due to [MSDN docs](https://msdn.microsoft.com/en-us/library/windows.ui.xaml.controls.webview.invokescriptasync.aspx) the invoked script can return only string values, otherwise the parameter, passed to __callback__ will be `[null]`.
451
452## InAppBrowser.insertCSS
453
454> Injects CSS into the `InAppBrowser` window.
455
456 ref.insertCSS(details, callback);
457
458- __ref__: reference to the `InAppBrowser` window _(InAppBrowser)_
459
460- __injectDetails__: details of the script to run, specifying either a `file` or `code` key. _(Object)_
461 - __file__: URL of the stylesheet to inject.
462 - __code__: Text of the stylesheet to inject.
463
464- __callback__: the function that executes after the CSS is injected.
465
466### Supported Platforms
467
468- Amazon Fire OS
469- Android
470- iOS
471- Windows
472
473### Quick Example
474
475 var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
476 ref.addEventListener('loadstop', function() {
477 ref.insertCSS({file: "mystyles.css"});
478 });
479__
480
481## <a id="sample"></a>Sample: Show help pages with an InAppBrowser
482
483You can use this plugin to show helpful documentation pages within your app. Users can view online help documents and then close them without leaving the app.
484
485Here's a few snippets that show how you do this.
486
487* [Give users a way to ask for help](#give).
488* [Load a help page](#load).
489* [Let users know that you're getting their page ready](#let).
490* [Show the help page](#show).
491* [Handle page errors](#handle).
492
493### <a id="give"></a>Give users a way to ask for help
494
495There's lots of ways to do this in your app. A drop down list is a simple way to do that.
496
497```html
498
499<select id="help-select">
500 <option value="default">Need help?</option>
501 <option value="article">Show me a helpful article</option>
502 <option value="video">Show me a helpful video</option>
503 <option value="search">Search for other topics</option>
504</select>
505
506```
507
508Gather the users choice in the ``onDeviceReady`` function of the page and then send an appropriate URL to a helper function in some shared library file. Our helper function is named ``showHelp()`` and we'll write that function next.
509
510```javascript
511
512$('#help-select').on('change', function (e) {
513
514 var url;
515
516 switch (this.value) {
517
518 case "article":
519 url = "https://cordova.apache.org/docs/en/latest/"
520 + "reference/cordova-plugin-inappbrowser/index.html";
521 break;
522
523 case "video":
524 url = "https://youtu.be/F-GlVrTaeH0";
525 break;
526
527 case "search":
528 url = "https://www.google.com/#q=inAppBrowser+plugin";
529 break;
530 }
531
532 showHelp(url);
533
534});
535
536```
537
538### <a id="load"></a>Load a help page
539
540We'll use the ``open`` function to load the help page. We're setting the ``hidden`` property to ``yes`` so that we can show the browser only after the page content has loaded. That way, users don't see a blank browser while they wait for content to appear. When the ``loadstop`` event is raised, we'll know when the content has loaded. We'll handle that event shortly.
541
542```javascript
543
544function showHelp(url) {
545
546 var target = "_blank";
547
548 var options = "location=yes,hidden=yes";
549
550 inAppBrowserRef = cordova.InAppBrowser.open(url, target, options);
551
552 inAppBrowserRef.addEventListener('loadstart', loadStartCallBack);
553
554 inAppBrowserRef.addEventListener('loadstop', loadStopCallBack);
555
556 inAppBrowserRef.addEventListener('loaderror', loadErrorCallBack);
557
558}
559
560```
561
562### <a id="let"></a>Let users know that you're getting their page ready
563
564Because the browser doesn't immediately appear, we can use the ``loadstart`` event to show a status message, progress bar, or other indicator. This assures users that content is on the way.
565
566```javascript
567
568function loadStartCallBack() {
569
570 $('#status-message').text("loading please wait ...");
571
572}
573
574```
575
576### <a id="show"></a>Show the help page
577
578When the ``loadstopcallback`` event is raised, we know that the content has loaded and we can make the browser visible. This sort of trick can create the impression of better performance. The truth is that whether you show the browser before content loads or not, the load times are exactly the same.
579
580```javascript
581
582function loadStopCallBack() {
583
584 if (inAppBrowserRef != undefined) {
585
586 inAppBrowserRef.insertCSS({ code: "body{font-size: 25px;" });
587
588 $('#status-message').text("");
589
590 inAppBrowserRef.show();
591 }
592
593}
594
595```
596You might have noticed the call to the ``insertCSS`` function. This serves no particular purpose in our scenario. But it gives you an idea of why you might use it. In this case, we're just making sure that the font size of your pages have a certain size. You can use this function to insert any CSS style elements. You can even point to a CSS file in your project.
597
598### <a id="handle"></a>Handle page errors
599
600Sometimes a page no longer exists, a script error occurs, or a user lacks permission to view the resource. How or if you handle that situation is completely up to you and your design. You can let the browser show that message or you can present it in another way.
601
602We'll try to show that error in a message box. We can do that by injecting a script that calls the ``alert`` function. That said, this won't work in browsers on Windows devices so we'll have to look at the parameter of the ``executeScript`` callback function to see if our attempt worked. If it didn't work out for us, we'll just show the error message in a ``<div>`` on the page.
603
604```javascript
605
606function loadErrorCallBack(params) {
607
608 $('#status-message').text("");
609
610 var scriptErrorMesssage =
611 "alert('Sorry we cannot open that page. Message from the server is : "
612 + params.message + "');"
613
614 inAppBrowserRef.executeScript({ code: scriptErrorMesssage }, executeScriptCallBack);
615
616 inAppBrowserRef.close();
617
618 inAppBrowserRef = undefined;
619
620}
621
622function executeScriptCallBack(params) {
623
624 if (params[0] == null) {
625
626 $('#status-message').text(
627 "Sorry we couldn't open that page. Message from the server is : '"
628 + params.message + "'");
629 }
630
631}
632
633```
634
635## More Usage Info
636
637### Local Urls ( source is in the app package )
638```
639var iab = cordova.InAppBrowser;
640
641iab.open('local-url.html'); // loads in the Cordova WebView
642iab.open('local-url.html', '_self'); // loads in the Cordova WebView
643iab.open('local-url.html', '_system'); // Security error: system browser, but url will not load (iOS)
644iab.open('local-url.html', '_blank'); // loads in the InAppBrowser
645iab.open('local-url.html', 'random_string'); // loads in the InAppBrowser
646iab.open('local-url.html', 'random_string', 'location=no'); // loads in the InAppBrowser, no location bar
647
648```
649
650
651
652### Whitelisted Content
653
654```
655var iab = cordova.InAppBrowser;
656
657iab.open('http://whitelisted-url.com'); // loads in the Cordova WebView
658iab.open('http://whitelisted-url.com', '_self'); // loads in the Cordova WebView
659iab.open('http://whitelisted-url.com', '_system'); // loads in the system browser
660iab.open('http://whitelisted-url.com', '_blank'); // loads in the InAppBrowser
661iab.open('http://whitelisted-url.com', 'random_string'); // loads in the InAppBrowser
662
663iab.open('http://whitelisted-url.com', 'random_string', 'location=no'); // loads in the InAppBrowser, no location bar
664
665```
666
667### Urls that are not white-listed
668
669```
670var iab = cordova.InAppBrowser;
671
672iab.open('http://url-that-fails-whitelist.com'); // loads in the InAppBrowser
673iab.open('http://url-that-fails-whitelist.com', '_self'); // loads in the InAppBrowser
674iab.open('http://url-that-fails-whitelist.com', '_system'); // loads in the system browser
675iab.open('http://url-that-fails-whitelist.com', '_blank'); // loads in the InAppBrowser
676iab.open('http://url-that-fails-whitelist.com', 'random_string'); // loads in the InAppBrowser
677iab.open('http://url-that-fails-whitelist.com', 'random_string', 'location=no'); // loads in the InAppBrowser, no location bar
678
679```
\No newline at end of file