web-dev-qa-db-ja.com

Ionic 2でブラウザ（ローカル開発）にいるかどうかを検出する方法

デバイス（iO、Androidなど）を使用している場合にのみinappbrowserを起動するようにしますが、ブラウザー（ローカル開発モードまたはgulpビルドを備えたWebアプリのみ）を使用している場合は、単にそれにリンクするだけですtarget = "_ blank"のページ。

Ionic 2コードをWebアプリとして再利用しようとしています。そのため、アプリをビルドすると、ブラウザデスクトップでも機能します。したがって、platform.ready（）では十分ではありません。ユーザーがデスクトップブラウザを使用しているかどうかを知る必要があるので、何か別のことができます。

cordovaionic-frameworkionic2
30
Hugh Hou

ここで、クリック機能の代わりに次の機能を使用できます。

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

これは役に立ちます:)

57
gsthina

ブラウザではplatform.is('core')、trueを使用できます。プラットフォームリスト：

  • Android：Androidを実行しているデバイス上。
  • cordova：Cordovaを実行しているデバイス上。
  • コア：デスクトップデバイス。
  • ios：iOSを実行しているデバイス。
  • ipad：iPadデバイス。
  • iphone：iPhoneデバイス。
  • モバイル：モバイルデバイス上。
  • mobileweb：モバイルデバイスのブラウザ内。
  • ファブレット：ファブレットデバイス上。
  • タブレット：タブレットデバイス上。
  • windows：Windowsを実行しているデバイス上。

詳細については、 http://ionicframework.com/docs/v2/api/platform/Platform/ を参照してください。

20
Hung Hoang

これにより、ブラウザを使用しているかどうかを検出できます。

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

coreはアプリケーションを開くWindowsブラウザーを使用している場合にのみ検出するが、chromeモバイルエミュレーションを使用している場合はcoreはfalseを返しますが、mobilewebはtrueを返すため、次を使用する必要があります。

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

Ionic 3アプリケーションで同じ問題に直面し、 ここ アプリケーションがブラウザと実際のデバイス/エミュレーターで実行されているかどうかを確認するニースの方法：

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

基本的に、実際のデバイスまたはエミュレーターは、ブラウザーで使用されるfileではなくhttpプロトコルを使用してリソースを提供するという事実に依存しています。

4
Alexei

私にとって最も信頼できるソリューションは、Platformの.is（）メソッドとその約束の結果の組み合わせでした。プロバイダー内でチェックを使用したため、グローバルに使用できました。たぶん、このアプローチは他の道を使い果たした人にとって有用でしょう。

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';
      }
    }
1
Martin Carstens

プロジェクトの「/ www」フォルダーをブラウザーで実行するのか、デバイス（emulate/build）で実行するのかを知る簡単な方法があります。

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ラベルをチェックインできます。ロードされている場合はアプリにあり、ロードされていない場合はブラウザ（ローカル）にあります。

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

私たちは自分がどこにいるかを知る最も早い方法だと思います。

0
CAPSULE DESARROLLO