Spec-Zone.ru › Cordova 9

cordova-plugin-inappbrowser

Вы можете отображать полезные статьи, видео и веб-ресурсы внутри своего приложения. Пользователи могут просматривать веб-страницы, не покидая ваше приложение.

Для получения нескольких идей, ознакомьтесь с примером внизу этой страницы или перейдите непосредственно к ссылкам.

Этот плагин предоставляет представление веб-браузера, которое отображается при вызове cordova.InAppBrowser.open().

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');

window.open

Функция cordova.InAppBrowser.open() определена как замена функции window.open(). Существующие вызовы window.open() могут использовать окно InAppBrowser, заменив window.open:

window.open = cordova.InAppBrowser.open;

Окно InAppBrowser ведет себя как стандартный веб-браузер и не может получить доступ к API Cordova. По этой причине InAppBrowser рекомендуется, если вам нужно загружать сторонний (ненадёжный) контент, вместо загрузки этого контента в основную веб-вью Cordova. InAppBrowser не подчиняется списку разрешённых доменов (whitelist), а также открытие ссылок в системном браузере не влияет на него.

InAppBrowser по умолчанию предоставляет собственные элементы управления пользовательским интерфейсом (назад, вперёд, готово).

Для обеспечения обратной совместимости этот плагин также подключает window.open. Однако, подключенный плагином обработчик window.open может иметь нежелательные побочные эффекты (особенно если этот плагин включён только как зависимость другого плагина). Обработчик window.open будет удалён в будущих крупных выпусках. Пока обработчик не удалён из плагина, приложения могут вручную восстановить стандартное поведение:

delete window.open // Reverts the call back to its prototype's default

Хотя window.open находится в глобальном пространстве имён, InAppBrowser недоступен до события deviceready.

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    console.log("window.open works well");
}

Установка

cordova plugin add cordova-plugin-inappbrowser

Если вы хотите, чтобы все загрузки страниц в вашем приложении проходили через InAppBrowser, вы можете просто подключить window.open во время инициализации. Например:

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    window.open = cordova.InAppBrowser.open;
}

cordova.InAppBrowser.open

Открывает URL в новом InAppBrowser экземпляре, текущем экземпляре браузера или системном браузере.

var ref = cordova.InAppBrowser.open(url, target, options);
  • ref: Ссылка на окно InAppBrowser при установке параметра target в '_blank'. (InAppBrowser)

  • url: URL для загрузки (строка). Вызовите encodeURI() для этого, если URL содержит символы Unicode.

  • target: Цель для загрузки URL, необязательный параметр по умолчанию _self. (строка)

    • _self: Открывает в Cordova WebView, если URL находится в списке разрешённых доменов (whitelist), в противном случае открывает в InAppBrowser.
    • _blank: Открывает в InAppBrowser.
    • _system: Открывает в системном веб-браузере.
  • options: Параметры для InAppBrowser. Необязательный параметр, по умолчанию: location=yes. (строка)

    Строка options не должна содержать пробелов, а пары имя/значение каждого параметра должны быть разделены запятыми. Имена параметров не чувствительны к регистру.

    Все платформы поддерживают:

    • location: Установите в значение yes или no для включения или выключения строки состояния (InAppBrowser).

    Android поддерживает следующие дополнительные параметры:

    • hidden: установите в yes для создания браузера и загрузки страницы, но не отображения её. Событие loadstop срабатывает после завершения загрузки. Пропустите или установите в значение no (по умолчанию), чтобы браузер открылся и загрузил страницу обычным образом.
    • beforeload: установите, чтобы включить событие beforeload для изменения того, какие страницы фактически загружаются в браузере. Допустимые значения: get для перехвата только запросов GET, post для перехвата запросов POST или yes для перехвата запросов GET и POST. Обратите внимание, что запросы POST в настоящее время не поддерживаются и будут проигнорированы (если вы установите beforeload=post, это вызовет ошибку).
    • clearcache: установите в yes для очистки кэша cookie браузера перед открытием нового окна.
    • clearsessioncache: установите в yes для очистки кэша сессионных cookie перед открытием нового окна.
    • closebuttoncaption: установите строку для использования в качестве подписи кнопки закрытия вместо X. Обратите внимание, что вам нужно самостоятельно локализовать это значение.
    • closebuttoncolor: установите допустимую строку шестнадцатеричного цвета, например: #00ff00, для изменения цвета кнопки закрытия от значения по умолчанию, независимо от того, текст или X. Действует только если установлен location = yes.
    • footer: установите в yes для отображения кнопки закрытия в футере, аналогично кнопке Готово в iOS. Кнопка закрытия будет выглядеть так же, как в заголовке, поэтому используйте closebuttoncaption и closebuttoncolor для настройки ее свойств.
    • footercolor: установите допустимую строку шестнадцатеричного цвета, например #00ff00 или #CC00ff00 (#aarrggbb), чтобы изменить цвет футера от значения по умолчанию. Действует только если footer установлен в yes.
    • hardwareback: установите в yes для использования аппаратной кнопки "Назад" для навигации назад по истории InAppBrowser. Если нет предыдущей страницы, InAppBrowser закроется. Значение по умолчанию - yes, поэтому вам нужно установить его в no если вы хотите, чтобы кнопка "Назад" просто закрывала InAppBrowser.
    • hidenavigationbuttons: установите в yes для скрытия кнопок навигации в строке состояния, действует только если user location установлен в yes. Значение по умолчанию no.
    • hideurlbar: установите в yes для скрытия строки адреса в строке состояния, действует только если user location установлен в yes. Значение по умолчанию no.
    • navigationbuttoncolor: установите допустимую строку шестнадцатеричного цвета, например: #00ff00, для изменения цвета обеих кнопок навигации от значения по умолчанию. Действует только если user location установлен в yes и hidenavigationbuttons не установлен в yes.
    • toolbarcolor: установите допустимую строку шестнадцатеричного цвета, например: #00ff00, для изменения цвета панели инструментов от значения по умолчанию. Действует только если user location установлен в yes.
    • lefttoright: установите в yes для изменения расположения кнопок навигации и кнопки закрытия. То есть кнопки навигации слева, а кнопка закрытия справа.
    • zoom: установите в yes для отображения элементов управления масштабированием браузера Android, установите в no для их скрытия. Значение по умолчанию yes.
    • mediaPlaybackRequiresUserAction: установите в yes для предотвращения автоматической воспроизведения аудио или видео HTML5 (по умолчанию no).
    • shouldPauseOnSuspend: Установите в yes для приостановки/возобновления InAppBrowser WebView вместе с приложением для остановки воспроизведения звука на заднем плане (это может потребоваться для устранения проблем Google Play, как описано в CB-11013).
    • useWideViewPort: Устанавливает, должен ли WebView поддерживать тег HTML meta "viewport" или использовать широкий viewport. При значении no, ширина макета всегда соответствует ширине элемента управления WebView в независимых от устройства (CSS) пикселях. При значении yes и наличии в странице тега meta viewport, используется значение ширины, указанное в теге. Если тег отсутствует или не содержит ширины, используется широкий viewport. (По умолчанию yes).

    iOS поддерживает следующие дополнительные параметры:

    • usewkwebview: устанавливается в значение yes для использования движка WKWebView для InappBrowser. Опустить или установить в значение no (по умолчанию) для использования UIWebView. Примечание: Использование usewkwebview=yes требует установки плагина WKWebView в проекте Cordova (например, cordova-plugin-wkwebview-engine или cordova-plugin-ionic-webview).
    • hidden: устанавливается в значение yes для создания браузера и загрузки страницы, но не отображения её. Событие loadstop срабатывает при завершении загрузки. Опустить или установить в значение no (по умолчанию) для открытия и нормальной загрузки браузера.
    • beforeload: устанавливается для включения события beforeload для изменения страниц, которые фактически загружаются в браузере. Допустимые значения: get для перехвата только запросов GET, post для перехвата запросов POST или yes для перехвата запросов GET и POST. Обратите внимание, что запросы POST в настоящее время не поддерживаются и будут игнорироваться (если установить beforeload=post, будет выведено сообщение об ошибке).
    • clearcache: устанавливается в значение yes для очистки кэша куки браузера перед открытием нового окна
    • clearsessioncache: устанавливается в значение yes для очистки кэша куки сессии перед открытием нового окна. Для WKWebView требуется iOS 11+ на целевом устройстве.
    • cleardata: устанавливается в значение yes для очистки всего локального хранилища браузера (куки, локальное хранилище HTML5, IndexedDB и т. д.) перед открытием нового окна
    • closebuttoncolor: задается как допустимая строка шестнадцатеричного цвета, например: #00ff00, для изменения цвета кнопки Готово по умолчанию. Применимо только если панель инструментов не отключена.
    • closebuttoncaption: устанавливается в строку, используемую в качестве заголовка кнопки Готово. Обратите внимание, что вам нужно локализовать это значение самостоятельно.
    • disallowoverscroll: Устанавливается в значение yes или no (по умолчанию no). Включает/выключает свойство UIWebViewBounce.
    • hidenavigationbuttons: устанавливается в yes или no для включения или отключения кнопок навигации панели инструментов (по умолчанию no). Применимо только если панель инструментов не отключена.
    • navigationbuttoncolor: устанавливается как допустимая строка шестнадцатеричного цвета, например: #00ff00, для изменения цвета по умолчанию. Применимо только если кнопки навигации видны.
    • toolbar: устанавливается в yes или no для включения или отключения панели инструментов для InAppBrowser (по умолчанию yes).
    • toolbarcolor: устанавливается как допустимая строка шестнадцатеричного цвета, например: #00ff00, для изменения цвета панели инструментов по умолчанию. Применимо только если панель инструментов не отключена.
    • toolbartranslucent: устанавливается в yes или no для создания полупрозрачной панели инструментов (по умолчанию yes). Применимо только если панель инструментов не отключена.
    • lefttoright: Устанавливается в yes для перестановки позиций кнопок навигации и кнопки закрытия. В частности, кнопка закрытия переходит вправо, а кнопки навигации - влево.
    • enableViewportScale: Устанавливается в yes или no для предотвращения масштабирования просмотра с помощью тега meta (по умолчанию no). Применимо только к UIWebView (usewkwebview=no) и WKWebView (usewkwebview=yes) на iOS 10+.
    • mediaPlaybackRequiresUserAction: Устанавливается в yes для предотвращения автоматического воспроизведения аудио или видео HTML5 (по умолчанию no). Применимо к UIWebView (usewkwebview=no) и WKWebView (usewkwebview=yes).
    • allowInlineMediaPlayback: Устанавливается в yes или no для разрешения встроенного воспроизведения медиа HTML5, отображая его внутри окна браузера вместо интерфейса воспроизведения устройства. Элемент HTML video также должен содержать атрибут webkit-playsinline (по умолчанию no). Применимо к UIWebView (usewkwebview=no) и WKWebView (usewkwebview=yes).
    • keyboardDisplayRequiresUserAction: Устанавливается в yes или no для открытия клавиатуры, когда элементы формы получают фокус через вызов JavaScript's focus() (по умолчанию yes). Применимо только к UIWebView (usewkwebview=no).
    • suppressesIncrementalRendering: Устанавливается в yes или no для ожидания получения всего нового содержимого представления перед отрисовкой (по умолчанию no). Применимо только к UIWebView (usewkwebview=no).
    • presentationstyle: Устанавливается в pagesheet, formsheet или fullscreen для установки стиля представления presentation style (по умолчанию fullscreen).
    • transitionstyle: Устанавливается в fliphorizontal, crossdissolve или coververtical для установки стиля перехода transition style (по умолчанию coververtical).
    • toolbarposition: Устанавливается в top или bottom (по умолчанию bottom). Размещает панель инструментов в верхней или нижней части окна.
    • hidespinner: Устанавливается в yes или no для изменения видимости индикатора загрузки (по умолчанию no).

    В окнах поддерживаются следующие дополнительные параметры:

    • hidden: устанавливается в yes для создания браузера и загрузки страницы, но не отображения её. Событие loadstop срабатывает при завершении загрузки. Опустить или установить в no (по умолчанию), чтобы браузер открылся и загрузился нормально.
    • hardwareback: работает так же, как и на платформе Android.
    • fullscreen: устанавливается в yes для создания элемента управления браузера без рамки вокруг него. Обратите внимание, что если также указан параметр location=no, пользователю не будет представлено управления для закрытия окна IAB.

Поддерживаемые платформы

  • Android
  • Браузер
  • iOS
  • OSX
  • Windows

Пример

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
var ref2 = cordova.InAppBrowser.open(encodeURI('http://ja.m.wikipedia.org/wiki/ハングル'), '_blank', 'location=yes');

Особенности OSX

В настоящее время единственной поддерживаемой целью в OSX является _system.

_blank и _self цели пока не реализованы и игнорируются.

Особенности браузера

  • Плагин реализован через iframe,

  • История навигации (кнопки back и forward в строке адреса) не реализована.

InAppBrowser

Объект, возвращаемый при вызове cordova.InAppBrowser.open при установке параметра назначения на '_blank'.

Методы

  • addEventListener
  • removeEventListener
  • close
  • show
  • hide
  • executeScript
  • insertCSS

InAppBrowser.addEventListener

Добавляет обработчик события от InAppBrowser. (Доступен только когда параметр назначения установлен на '_blank')

ref.addEventListener(eventname, callback);
  • ref: ссылка на окно InAppBrowser (InAppBrowser)

  • eventname: событие для прослушивания (Строка)

    • loadstart: событие срабатывает, когда InAppBrowser начинает загружать URL.
    • loadstop: событие срабатывает, когда InAppBrowser завершает загрузку URL.
    • loaderror: событие срабатывает, когда InAppBrowser сталкивается с ошибкой при загрузке URL.
    • exit: событие срабатывает, когда окно InAppBrowser закрывается.
    • beforeload: событие срабатывает, когда InAppBrowser принимает решение загружать URL или нет (только с параметром beforeload).
    • message: событие срабатывает, когда InAppBrowser получает сообщение, отправленное из страницы, загруженной внутри InAppBrowser Webview.
  • callback: функция, выполняемая при срабатывании события. Функция получает объект InAppBrowserEvent в качестве параметра.

Пример

var inAppBrowserRef;

function showHelp(url) {

    var target = "_blank";

    var options = "location=yes,hidden=yes,beforeload=yes";

    inAppBrowserRef = cordova.InAppBrowser.open(url, target, options);

    inAppBrowserRef.addEventListener('loadstart', loadStartCallBack);

    inAppBrowserRef.addEventListener('loadstop', loadStopCallBack);

    inAppBrowserRef.addEventListener('loaderror', loadErrorCallBack);

    inAppBrowserRef.addEventListener('beforeload', beforeloadCallBack);

    inAppBrowserRef.addEventListener('message', messageCallBack);
}

function loadStartCallBack() {

    $('#status-message').text("loading please wait ...");

}

function loadStopCallBack() {

    if (inAppBrowserRef != undefined) {

        inAppBrowserRef.insertCSS({ code: "body{font-size: 25px;" });

        inAppBrowserRef.executeScript({ code: "\
            var message = 'this is the message';\
            var messageObj = {my_message: message};\
            var stringifiedMessageObj = JSON.stringify(messageObj);\
            webkit.messageHandlers.cordova_iab.postMessage(stringifiedMessageObj);"
        });

        $('#status-message').text("");

        inAppBrowserRef.show();
    }

}

function loadErrorCallBack(params) {

    $('#status-message').text("");

    var scriptErrorMesssage =
       "alert('Sorry we cannot open that page. Message from the server is : "
       + params.message + "');"

    inAppBrowserRef.executeScript({ code: scriptErrorMesssage }, executeScriptCallBack);

    inAppBrowserRef.close();

    inAppBrowserRef = undefined;

}

function executeScriptCallBack(params) {

    if (params[0] == null) {

        $('#status-message').text(
           "Sorry we couldn't open that page. Message from the server is : '"
           + params.message + "'");
    }

}

function beforeloadCallBack(params, callback) {

    if (params.url.startsWith("http://www.example.com/")) {

        // Load this URL in the inAppBrowser.
        callback(params.url);
    } else {

        // The callback is not invoked, so the page will not be loaded.
        $('#status-message').text("This browser only opens pages on http://www.example.com/");
    }

}

function messageCallBack(params){
    $('#status-message').text("message received: "+params.data.my_message);
}

Свойства InAppBrowserEvent

  • type: событие, либо loadstart, loadstop, loaderror, message или exit. (Строка)

  • url: загруженный URL. (Строка)

  • code: код ошибки, только в случае loaderror. (Число)

  • message: сообщение об ошибке, только в случае loaderror. (Строка)

  • data: содержимое сообщения, только в случае message. Объект JSON в строковом формате. (Строка)

Поддерживаемые платформы

  • Android
  • Браузер
  • iOS
  • Windows
  • OSX

Особенности браузера

События loadstart, loaderror, message не генерируются.

Особенности Windows

Событие message не генерируется.

Быстрый пример

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
ref.addEventListener('loadstart', function(event) { alert(event.url); });

InAppBrowser.removeEventListener

Удаляет обработчик события от InAppBrowser. (Доступен только когда параметр назначения установлен на '_blank')

ref.removeEventListener(eventname, callback);
  • ref: ссылка на окно InAppBrowser. (InAppBrowser)

  • eventname: событие, на которое нужно перестать подписываться. (Строка)

    • loadstart: событие срабатывает, когда InAppBrowser начинает загружать URL.
    • loadstop: событие срабатывает, когда InAppBrowser завершает загрузку URL.
    • loaderror: событие срабатывает, когда InAppBrowser сталкивается с ошибкой при загрузке URL.
    • exit: событие срабатывает, когда окно InAppBrowser закрывается.
    • message: событие срабатывает, когда InAppBrowser получает сообщение, отправленное со страницы, загруженной внутри InAppBrowser Webview.
  • callback: функция, которая выполняется при срабатывании события. Функции передается объект InAppBrowserEvent.

Поддерживаемые платформы

  • Android
  • Браузер
  • iOS
  • Windows

Быстрый пример

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
var myCallback = function(event) { alert(event.url); }
ref.addEventListener('loadstart', myCallback);
ref.removeEventListener('loadstart', myCallback);

InAppBrowser.close

Закрывает окно InAppBrowser.

ref.close();
  • ref: ссылка на окно InAppBrowser (InAppBrowser)

Поддерживаемые платформы

  • Android
  • Браузер
  • iOS
  • Windows

Быстрый пример

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
ref.close();

InAppBrowser.show

Отображает окно InAppBrowser, которое было открыто скрытым. Вызов не имеет эффекта, если InAppBrowser уже был виден.

ref.show();
  • ref: ссылка на окно InAppBrowser (InAppBrowser)

Поддерживаемые платформы

  • Android
  • Браузер
  • iOS
  • Windows

Быстрый пример

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'hidden=yes');
// some time later...
ref.show();

InAppBrowser.hide

Скрывает окно InAppBrowser. Вызов не имеет эффекта, если InAppBrowser уже был скрыт.

ref.hide();
  • ref: ссылка на окно InAppBrowser (InAppBrowser)

Поддерживаемые платформы

  • Android
  • iOS
  • Windows

Быстрый пример

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank');
// some time later...
ref.hide();

InAppBrowser.executeScript

Вставляет код JavaScript в окно InAppBrowser. (Доступно только при установленном целевом параметре '_blank')

ref.executeScript(details, callback);
  • ref: ссылка на окно InAppBrowser. (InAppBrowser)

  • injectDetails: детали скрипта для выполнения, указав ключ file или code. (Объект)

    • file: URL скрипта для вставки.
    • code: Текст скрипта для вставки.
  • callback: функция, которая выполняется после вставки кода JavaScript.

    • Если вставленный скрипт типа code, callback выполняется с единственным параметром, который является возвращаемым значением скрипта, заключённым в Array. Для многострочных скриптов это возвращаемое значение последней инструкции или последнего выражения, вычисленного.

Поддерживаемые платформы

  • Android
  • Браузер
  • iOS
  • Windows

Быстрый пример

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
ref.addEventListener('loadstop', function() {
    ref.executeScript({file: "myscript.js"});
});

Особенности браузера

  • поддерживается только ключ code.

Особенности Windows

Из-за MSDN документации вызванный скрипт может вернуть только строковые значения, в противном случае параметр, передаваемый в callback, будет [null].

InAppBrowser.insertCSS

Вставляет CSS в окно InAppBrowser. (Доступно только при установленном целевом параметре '_blank')

ref.insertCSS(details, callback);
  • ref: ссылка на окно InAppBrowser (InAppBrowser)

  • injectDetails: детали скрипта для выполнения, указав ключ file или code . (Объект)

    • file: URL таблицы стилей для вставки.
    • code: Текст таблицы стилей для вставки.
  • callback: функция, которая выполняется после вставки CSS.

Поддерживаемые платформы

  • Android
  • iOS
  • Windows

Быстрый пример

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
ref.addEventListener('loadstop', function() {
    ref.insertCSS({file: "mystyles.css"});
});

__

Пример: Отображение страниц справки с помощью InAppBrowser

Вы можете использовать этот плагин для отображения полезных страниц документации в приложении. Пользователи могут просматривать онлайн-документы справки и затем закрывать их, не покидая приложение.

Вот несколько фрагментов, которые показывают, как это сделать.

  • Предоставьте пользователям способ запросить помощь.
  • Загрузить страницу справки.
  • Уведомить пользователей о подготовке страницы.
  • Показать страницу справки.
  • Обработка ошибок страницы.

Предоставьте пользователям способ запросить помощь

Существует множество способов сделать это в вашем приложении. Выпадающий список — простой способ для этого.

<select id="help-select">
    <option value="default">Need help?</option>
    <option value="article">Show me a helpful article</option>
    <option value="video">Show me a helpful video</option>
    <option value="search">Search for other topics</option>
</select>

Соберите выбор пользователя в функции onDeviceReady страницы, а затем отправьте соответствующий URL в вспомогательную функцию в файле общей библиотеки. Наша вспомогательная функция называется showHelp() и мы напишем её дальше.

$('#help-select').on('change', function (e) {

    var url;

    switch (this.value) {

        case "article":
            url = "https://cordova.apache.org/docs/en/latest/"
                        + "reference/cordova-plugin-inappbrowser/index.html";
            break;

        case "video":
            url = "https://youtu.be/F-GlVrTaeH0";
            break;

        case "search":
            url = "https://www.google.com/#q=inAppBrowser+plugin";
            break;
    }

    showHelp(url);

});

Загрузить страницу справки

Мы воспользуемся функцией open для загрузки страницы справки. Мы устанавливаем свойство hidden в yes, чтобы мы могли показать браузер только после загрузки содержимого страницы. Таким образом, пользователи не видят пустой браузер, пока ждут появления содержимого. Когда срабатывает событие loadstop, мы узнаем, когда содержимое загрузится. Мы обработаем это событие вскоре.

function showHelp(url) {

    var target = "_blank";

    var options = "location=yes,hidden=yes";

    inAppBrowserRef = cordova.InAppBrowser.open(url, target, options);

    inAppBrowserRef.addEventListener('loadstart', loadStartCallBack);

    inAppBrowserRef.addEventListener('loadstop', loadStopCallBack);

    inAppBrowserRef.addEventListener('loaderror', loadErrorCallBack);

}

Уведомить пользователей о подготовке страницы

Поскольку браузер не появляется сразу, мы можем использовать событие loadstart для отображения сообщения о статусе, индикатора прогресса или других индикаторов. Это гарантирует пользователям, что содержимое скоро появится.

function loadStartCallBack() {

    $('#status-message').text("loading please wait ...");

}

Показать страницу справки

Когда срабатывает событие loadstopcallback, мы знаем, что содержимое загрузилось, и можем сделать браузер видимым. Такой трюк может создать впечатление о лучшей производительности. На самом деле, показываете ли вы браузер до загрузки содержимого или нет, время загрузки остается неизменным.

function loadStopCallBack() {

    if (inAppBrowserRef != undefined) {

        inAppBrowserRef.insertCSS({ code: "body{font-size: 25px;" });

        $('#status-message').text("");

        inAppBrowserRef.show();
    }

}

Вы, возможно, заметили вызов функции insertCSS. В нашем случае это не имеет особой цели. Но это даёт вам представление о том, зачем вы можете её использовать. В данном случае мы просто убеждаемся, что размер шрифта ваших страниц имеет определённый размер. Вы можете использовать эту функцию для вставки любых элементов CSS-стилей. Вы даже можете указать на файл CSS в вашем проекте.

Обработка ошибок страницы

Иногда страница больше не существует, возникает ошибка скрипта или у пользователя нет разрешения на просмотр ресурса. Как и обрабатывать такую ситуацию — полностью зависит от вас и вашего дизайна. Вы можете позволить браузеру показать это сообщение, или вы можете представить его иначе.

Мы попробуем показать эту ошибку в окне сообщения. Мы можем сделать это, вставив скрипт, который вызывает функцию alert. Однако это не будет работать в браузерах на устройствах Windows, поэтому нам придётся посмотреть на параметр функции обратного вызова executeScript, чтобы увидеть, удалось ли нам это. Если это не сработало, мы просто отобразим сообщение об ошибке в <div> на странице.

function loadErrorCallBack(params) {

    $('#status-message').text("");

    var scriptErrorMesssage =
       "alert('Sorry we cannot open that page. Message from the server is : "
       + params.message + "');"

    inAppBrowserRef.executeScript({ code: scriptErrorMesssage }, executeScriptCallBack);

    inAppBrowserRef.close();

    inAppBrowserRef = undefined;

}

function executeScriptCallBack(params) {

    if (params[0] == null) {

        $('#status-message').text(
           "Sorry we couldn't open that page. Message from the server is : '"
           + params.message + "'");
    }

}

Дополнительная информация об использовании

Локальные URL-адреса (исходный код находится в пакете приложения)

var iab = cordova.InAppBrowser;

iab.open('local-url.html');                  // loads in the Cordova WebView
iab.open('local-url.html', '_self');         // loads in the Cordova WebView
iab.open('local-url.html', '_system');       // Security error: system browser, but url will not load (iOS)
iab.open('local-url.html', '_blank');        // loads in the InAppBrowser
iab.open('local-url.html', 'random_string'); // loads in the InAppBrowser
iab.open('local-url.html', 'random_string', 'location=no'); // loads in the InAppBrowser, no location bar

Разрешённое содержимое

var iab = cordova.InAppBrowser;

iab.open('http://whitelisted-url.com');                  // loads in the Cordova WebView
iab.open('http://whitelisted-url.com', '_self');         // loads in the Cordova WebView
iab.open('http://whitelisted-url.com', '_system');       // loads in the system browser
iab.open('http://whitelisted-url.com', '_blank');        // loads in the InAppBrowser
iab.open('http://whitelisted-url.com', 'random_string'); // loads in the InAppBrowser

iab.open('http://whitelisted-url.com', 'random_string', 'location=no'); // loads in the InAppBrowser, no location bar

URL-адреса, не включённые в белый список

var iab = cordova.InAppBrowser;

iab.open('http://url-that-fails-whitelist.com');                  // loads in the InAppBrowser
iab.open('http://url-that-fails-whitelist.com', '_self');         // loads in the InAppBrowser
iab.open('http://url-that-fails-whitelist.com', '_system');       // loads in the system browser
iab.open('http://url-that-fails-whitelist.com', '_blank');        // loads in the InAppBrowser
iab.open('http://url-that-fails-whitelist.com', 'random_string'); // loads in the InAppBrowser
iab.open('http://url-that-fails-whitelist.com', 'random_string', 'location=no'); // loads in the InAppBrowser, no location bar

© 2012, 2013, 2015 The Apache Software Foundation
Licensed under the Apache License 2.0.
https://cordova.apache.org/docs/en/9.x/reference/cordova-plugin-inappbrowser/index.html

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API