1

我的应用需要来自外部 url 的登录页面。

我认为的登录逻辑是：

脚步

  1. 启动 ionic 时打开外部 url
  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插件。但结果与第二和第三相同。它仍然会打开一个带有地址栏、工具栏的浏览器，即使它显示“返回 myApp”。所以用户会觉得这超出了应用程序。 在这里检查，人们仍在寻找解决方案。

花了一天后，我什至不知道是否有可以尝试的选项。

4

2 回答 2

2

我可以通过这样做来解决。但在真实设备中。Xcode iPhone 模拟器没有打开的应用内浏览器，而是内置浏览器。

browser:any;

this.platform.ready().then(() => {
        this.browser = this.iab.create(this.loginUrl, '_blank', 'location=no,toolbar=no'); 
    });
于 2017-06-28T15:27:53.467 回答
0

您可以通过安装一个名为 cordova-plugin-inappbrowser 的 cordova 插件来解决这个问题。执行以下命令：

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.
于 2017-11-06T15:24:02.417 回答