Capacitor Plugin APIs

Capacitor には、すべての Capacitor アプリで利用できるいくつかの Native なプラグイン API が含まれている。これらは Capacitor「コアプラグイン」と考えることができ、各プラットフォームで共通に必要な機能に簡単にアクセスできるようにします。

Cordova から来た人のために、コア Capacitor プラグインはコア Cordova プラグインの多くをカバーし、いくつかの新しいものも含んでいる。

使用可能なプラグインの完全なリストについては、左のメニューの 「プラグイン」 リストを参照してください。

API の使い方

Capacitor プラグインを使うには以下の手順となります:

1) Plugins オブジェクトをインポートします。これはすべての Capacitor プラグインのレジストリとなります。

import { Plugins } from '@capacitor/core';

2) プラグインレジストリ (Plugins オブジェクト)から利用するプラグインを取得します。

const { Browser } = Plugins;

3) プラグインの API をご利用ください:

async openBrowser() {
  // On iOS, for example, open the URL in SFSafariViewController (the in-app browser)
  await Browser.open({ url: "https://ionicframework.com" });
}

よくある間違いは、プラグインを直接インポートしてすぐにプラグイン API を使用すると、Web だけで動作する実装が使用されてしまうことです:

import { Browser } from '@capacitor/core';

async openBrowser() {
  // On iOS, for example, this will open the URL in Safari instead of
  // the SFSafariViewController (in-app browser)
  await Browser.open({ url: "https://ionicframework.com" });
}

プラグインレジストリ(Plugins オブジェクト)のプラグインを使用することで、プラグインの Native 実装が(利用可能な場合)使用され、Web バージョンにフォールバックします。

Angular Notes

Capacitor plugin event listeners run outside of Angular’s NgZone execution context. Contain handler logic within an NgZone.run block to ensure Angular’s change detection is triggered:

constructor(private ngZone: NgZone) { }

async ngOnInit() {
  Network.addListener("networkStatusChange", (status) => {
    this.ngZone.run(() => {
      // This code will run in Angular's execution context
      this.networkStatus = status.connected ? "Online" : "Offline";
    });
  });
}