ionic3 открыть внешний URL-адрес без адресной строки и панели инструментов и кнопки закрытия

Моему приложению нужна страница входа с внешнего URL-адреса.

Логика входа, которую я думал, такова:

Шаги

  1. Открывать внешний URL при запуске ionic
  2. Как только пользователь войдет в систему, вернитесь к внутреннему приложению, используя глубокую ссылку (например: myapp://main).

Я проверил шаг 2, который представляет собой глубокую ссылку. Работает хорошо.

Итак, я должен сделать шаг 1 сейчас.

Сначала я тестировал с iframe. И получил Refused to display 'https:....' in a frame because it set 'X-Frame-Options' to 'deny'. ошибку. Кажется, для этого нужна конфигурация на стороне сервера. Но в любом случае мы не хотим использовать этот путь. iframe похоже на взлом.

Во-вторых, я попробовал location.href = this.loginUrl;. Хорошо работал в браузере Chrome, но когда я встроил симулятор iOS, я вижу адресную строку, панель инструментов и кнопку закрытия. Мне это не нравится, потому что я не хочу, чтобы пользователь закрывал страницу входа или изменить URL-адрес.

В-третьих, попробовал window.open(this.loginUrl, '_self', 'location=no'). Тот же результат, что и во втором.

В-четвертых, попытался использовать ионную версию in-app-browserплагина. Но результат такой же, как у второго и третьего. Он по-прежнему открывает браузер с адресной строкой, панелью инструментов, даже если она показывает «назад к моему приложению». Таким образом, пользователь почувствует, что это не приложение. Проверьте здесь, люди ищут для решения еще.

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


webview ionic3 inappbrowser login external-url
person Téwa    schedule 26.06.2017    source источник
comment
вы можете попробовать toolbar=no посмотреть параметры IOS на github.com/apache/cordova-plugin-inappbrowser   -  person Sohan    schedule 28.06.2017

Ответы (2)


arrow_upward
2
arrow_downward

Я мог бы решить, сделав это. Но в реальном устройстве. Эмуляторы Xcode iPhone не имеют открытого браузера в приложении, но имеют встроенный браузер.

browser:any;

this.platform.ready().then(() => {
        this.browser = this.iab.create(this.loginUrl, '_blank', 'location=no,toolbar=no'); 
    });
person Téwa    schedule 28.06.2017

arrow_upward
0
arrow_downward

Вы можете решить эту проблему, установив плагин Cordova под названием cordova-plugin-inappbrowser. Выполните следующие команды:

ionic plugin add cordova-plugin-inappbrowser
npm install --save @ionic-native/in-app-browser

В вашем app.module.ts добавьте

import { InAppBrowser } from '@ionic-native/in-app-browser';

а также добавьте следующее к вашим провайдерам в app.module.ts

    providers: [
    StatusBar,
    SplashScreen,
    InAppBrowser,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]

Затем на вашем home.ts добавьте

import { InAppBrowser } from '@ionic-native/in-app-browser';

и вставьте его в конструктор следующим образом

    constructor(public navCtrl: NavController, private iab: InAppBrowser) {

  }

затем добавьте следующий метод

 ionViewDidLoad(){
    this.iab.create('url', '_self', { location: 'no' }); }

Проверьте различные параметры этого подключаемого модуля здесь

Для удаления адресной строки просто используйте опцию:

location: Set to yes or no to turn the InAppBrowser's location bar on or off.
person hopper    schedule 06.11.2017
comment
эй, я установил местоположение: «нет», тогда он скрывает адресную строку, но навигация по страницам не работает. У меня есть сайт на WordPress. - person Manish; 18.05.2018