如何在Ionic 2中检测是否处于浏览器（本地开发）环境

Question

我希望只在设备上（iOs、Android等）启动inappbrowser，而如果我处于浏览器中（本地开发模式或只是使用gulp构建的Web应用程序），我想要连接到那个具有target="_blank"的页面。

我正在尝试将Ionic 2代码重用为Web应用程序。因此，当我构建该应用程序时，它也将在桌面浏览器中工作。所以，仅使用platform.ready()不足够。因为我需要知道用户是否在桌面浏览器上，我可以进行一些不同的操作。

- Hugh Hou

Answer 1

这里是您需要的代码，您可以使用以下函数替换您之前的点击函数。

onClickOfButton(){
      // Check If Cordova/Mobile
   if (this.platform.is('cordova')) {
        window.location.href = url;
   }else{
        window.open(url,'_blank');
   }
}

这可能会有所帮助 :)

- gsthina

Answer 2

您可以使用platform.is（'core'）来判断是否在浏览器上，如果返回true，表示在浏览器上，以下是平台列表：

• android：在运行Android的设备上。
• cordova：在运行Cordova的设备上。
• core：在桌面设备上。
• ios：在运行iOS的设备上。
• ipad：在iPad设备上。
• iphone：在iPhone设备上。
• mobile：在移动设备上。
• mobileweb：在移动设备上的浏览器中。
• phablet：在平板手机上。
• tablet：在平板电脑上。
• windows：在运行Windows的设备上。

有关更多详细信息，请参见http://ionicframework.com/docs/v2/api/platform/Platform/。

- Hung Hoang

---

无法与最新的ionic2配合使用。如果您将Chrome桌面浏览器设置为移动仿真，则在测试“core”时会返回false。 - Johncl

应该写成"iOS"，而不是"ioson"。 - Juangui Jordán

当在桌面模式下使用移动Chrome浏览器时，对我而言，“是”不起作用。是否有其他解决方案？ - carstenbaumhoegger

@johncl：然后关闭移动仿真 :-) - Kieran Ryan

当我通过“serve”命令在Chrome中运行应用程序时，出现了“不再工作”的情况，我得到了“mobile，ios，iphone，mobileweb”。 - fifth

Answer 3

使用这个方法可以检测当前是否在浏览器中：

if(window.hasOwnProperty('cordova')){ /* use webview */ }
else { /* use browser link */ }

- Luca C.

Answer 4

基于 hhung，因为 core 仅检测您是否使用 Windows 浏览器打开应用程序，但如果您使用的是 Chrome 移动仿真，则 core 将返回 false，但 mobileweb 将返回 true。因此，您应该使用以下内容：

if(this.platform.is('core') || this.platform.is('mobileweb')) {
  this.isApp = false;
} else {
  this.isApp = true;
}

- bennyxguo

Answer 5

我在一个Ionic 3应用程序中遇到了同样的问题，并在这里找到了一种很好的方法来检查应用程序是在浏览器上运行还是在真实设备/模拟器上运行：

isApp = !document.URL.startsWith('http');

基本上，它依赖于一个事实，即真实设备或模拟器使用“file”协议来提供资源，而不是浏览器所使用的“http”协议。

- Alexei - check Codidact

---

иҝҷеңЁдҪҝз”ЁWKWebviewжҸ’件зҡ„iOSдёҠдёҚиө·дҪңз”ЁпјҢиҖҢиҜҘжҸ’件еҚіе°ҶжҲҗдёәй»ҳи®ӨйҖүйЎ№гҖӮ - Blunderfest

Answer 6

对我来说最可靠的解决方案是使用 Platform 的 .is() 方法和它的 promise 结果的组合。我在提供程序中使用了这个检查，所以我可以全局使用它。也许这种方法对已经尝试过其他方法的人有用。

import { Platform } from 'ionic-angular';

constructor(public platform: Platform) { 

  public env:string = 'dev';

  this.platform.ready().then((readySource) => {

    if (readySource) {
      if (platform.is('core') || readySource.toLowerCase() !== 'cordova') {
        this.env = 'dev';
      }
      else {
        this.env = 'production';
      }
    }

- Martin Carstens

Answer 7

我们有一种简单的方法来判断我们是在浏览器中运行项目的'/www'文件夹，还是在设备（模拟/构建）中运行。

在Cordova/Phonegap的本地项目中，index.html具有以下标签：

<script type="text/javascript" src="cordova.js"></script>

但是这个文件并不存在，因为Cordova/Phonegap在模拟或构建时会注入phonegap.js或cordova.js。如果我们在浏览器中运行www文件夹，则始终会看到如下错误：

GET file:///D:/Cordova/Workspace/TestProject/www/cordova.js net::ERR_FILE_NOT_FOUND

然后我们可以在 index.html 标签中检查该文件是否已加载。如果已加载，则表示我们在 App 中，否则表示我们在浏览器（本地）中：

<script type="text/javascript" src="cordova.js" onload="alert('app!');"></script>

我们认为这是最快速了解我们所在位置的方式。

- CAPSULE DESARROLLO