Ionic InAppBrowser异常：网页跳转至Chrome而非在App内打开

我看到你遇到的问题了——想在Ionic应用内用InAppBrowser打开指定网站，结果总是跳去Chrome浏览器。咱们先梳理下你代码里的几个小问题，然后给你修正后的可运行版本：

你的代码存在的问题 #

1. 参数传递错误：调用this.iab.create()时，最后多传了一个options变量，导致配置结构混乱，InAppBrowser无法正确识别你的设置
2. 引号转义问题：代码里出现了"这种HTML转义的双引号，应该直接使用普通的单/双引号，避免解析异常
3. 核心配置未生效：虽然你写了location:"no"，但因为参数传递错误，这个关键配置没起作用——location: 'no'是控制是否在应用内打开的核心开关

修正后的代码 #

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

// ...

constructor(private iab: InAppBrowser) {
  const options: InAppBrowserOptions = {
    zoom: 'no',
    fullscreen: 'yes',
    hidenavigationbuttons: 'no',
    toolbar: 'no',
    hideurlbar: 'yes',
    location: 'no' // 这个配置是核心，确保在应用内打开而非跳转外部
  };

  const browser = this.iab.create('https://surveyor.igiinsurance.com.pk/', '_blank', options);
  browser.show();
}

关键说明 #

• location: 'no'：这个配置会强制InAppBrowser在应用内部的WebView中打开链接，而不是调用系统默认的外部浏览器（比如Chrome）
• 统一配置对象：把所有配置项都放在一个options对象里，一次性传递给create()方法，避免参数混乱
• 引号统一：全部使用单引号（或双引号），不要混用转义字符，确保代码解析正常

额外检查项 #

确保你已经正确安装并配置了InAppBrowser插件：

• 执行安装命令：npm install @ionic-native/in-app-browser
• 在app.module.ts中导入并添加到providers数组：

  import { InAppBrowser } from '@ionic-native/in-app-browser/ngx';
  
  @NgModule({
    // ...
    providers: [
      // ...
      InAppBrowser
    ]
  })
  export class AppModule { }
  

内容的提问来源于stack exchange，提问作者rameez khan