Ionic 4 - InAppBrowser 不使用“_blank” - 页面不加载答案

【问题标题】：Ionic 4 - InAppBrowser not working with '_blank' - Page doesn't loadIonic 4 - InAppBrowser 不使用“_blank” - 页面不加载
【发布时间】：2019-08-13 16:01:14
【问题描述】：

我已经完成了一个使用 InAppBrowser 的 Ionic 4 应用程序，当目标为 _self 时，它在 iOS 设备上运行良好，但当目标为 _blank 时，InAppBrowser 尝试加载网页但仍显示在白屏上。

我已经安装了

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

我已经在对应的ts页面和app.module.ts中导入了

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

我已在 app.module.ts 中将其声明为提供程序

providers: [
InAppBrowser,
StatusBar,
SplashScreen,
CallNumber,
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
],

这是代码

const browser = this.iab.create('https://www.google.com', '_blank');
browser.show();

【问题讨论】：

我得出的结论是 Occasional Error: NSURLErrorDomain error -999 实际上与此问题无关。

标签： node.js angular ionic-framework inappbrowser

【解决方案1】：

您不需要添加以下代码 browser.show();

【讨论】：

我不明白你想说什么
这行代码不需要。没有“browser.show();”它也是打开的浏览器。
删除 browser.show();不能解决问题。

【解决方案2】：

我记得这个错误专门针对 ios 设备。我的原因是使用 localhost:XXXX 而不是 XXXX 是端口号的有效 url。如果您的 XXXX 端口上没有运行任何应用程序，就会发生这种情况。

我意识到在 iOS 上，当您使用像 localhost:XXXX 这样的无效 URL 时，inappbrowser 无法呈现带有 404 错误的页面。它只是无法显示任何内容:(。在 android 设备上，您会收到一个 404 页面，提示找不到 URL。但在 iOS 上，这不会发生。我花了一段时间才弄清楚。

谈到您的问题，如果您使用有效的有效 URL 遇到此问题，请检查您是否已连接到互联网。

【讨论】：

感谢您的参与。不幸的是，我遇到了有效 URL 的问题。互联网连接也不是问题。正如我上面提到的，当使用 target _self 时，一切都很好。只有在使用 target _blank 时才会出现问题。我只是满足于使用 target _self，但我需要能够使用后退按钮或关闭应用内浏览器并返回应用本身。
得到了这个stackoverflow.com/questions/16073519/…。希望对您有所帮助。
感谢参与，但正如我上面提到的，我得出的结论是 Occasional Error: NSURLErrorDomain error -999 实际上与此问题无关:(
好的。你达到预期的结果了吗？
不，当目标是 _blank InAppBrowser 时，我仍然得到一个空白屏幕。

【解决方案3】：

虽然问题在 Ionic Dev App 中仍然存在，但在我通过 TestFlight 测试的最终应用程序构建中并没有发生。所以看起来这只是一个 Ionic Dev App 问题。

【讨论】：

【解决方案4】：

截至 2021 年 2 月 26 日。使用 ionic 6。 我遇到了这个问题，但我发现这个问题正在发生，因为我在添加 cordova InAppBrowser 插件之前已经构建了我的项目。

我的解决方案

打开您的项目目录。找到文件夹 android（或 iOS，具体取决于您构建的平台）和文件夹平台。
在项目目录之外的某个地方复制上面列出的两个文件夹，或者您只需重命名它们。
打开您的 CLI 并导航到项目目录，然后按顺序运行以下代码。
1. npm run build
2. ionic capacitor add android
3. ionic capacitor copy android && cd android && gradlew assembleDebug && cd ..

【讨论】：