メインコンテンツへスキップ

スタートガイド

GitHub

AIアシストによるセットアップでプラグインをインストールできます。以下のコマンドを使用して、お使いのAIツールに Capgo のスキルを追加してください:

ターミナル
bunx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

次に、以下のプロンプトを使用します:

Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-network-diagnostics` plugin in my project.

手動セットアップを希望する場合は、以下のコマンドを実行してプラグインをインストールし、下記のプラットフォーム別の手順に従ってください:

ターミナル
bun add @capgo/capacitor-network-diagnostics
bunx cap sync
import { NetworkDiagnostics } from '@capgo/capacitor-network-diagnostics';
import { NetworkDiagnostics } from '@capgo/capacitor-network-diagnostics';
const result = await NetworkDiagnostics.getNetworkStatus();
console.log(result);
import { NetworkDiagnostics } from '@capgo/capacitor-network-diagnostics';
const result = await NetworkDiagnostics.testUrl({ url: 'https://example.com' });
console.log(result);
import { NetworkDiagnostics } from '@capgo/capacitor-network-diagnostics';
const result = await NetworkDiagnostics.testPort({
host: 'example.com',
port: 8080,
});
console.log(result);
  • ネイティブ同期: 実行 bunx cap sync プラグインのアップグレード後。
  • 信頼できる情報源: 信頼 src/definitions.ts GitHub リポジトリ内。

runDiagnostics 制限されたネットワーク環境にいるユーザーのサポートレポートを収集する、最も迅速な方法です。

const report = await NetworkDiagnostics.runDiagnostics({
urls: [{ url: 'https://api.example.com/health', method: 'HEAD' }],
ports: [{ host: 'api.example.com', port: 443 }],
websockets: [{ url: 'wss://ws.example.com/socket' }],
download: {
url: 'https://speed.example.com/5mb.bin',
maxBytes: 5 * 1024 * 1024,
},
packetLoss: {
mode: 'tcp',
host: 'api.example.com',
port: 443,
count: 10,
},
});
console.log(report.status.connectionType);
console.log(report.issues);
const status = await NetworkDiagnostics.getNetworkStatus();
console.log(status.connected);
console.log(status.connectionType);
console.log(status.internetReachable);
console.log(status.captivePortal);

使用するフラグはプラットフォームによって異なります。Androidでは、検証済みのインターネット接続やキャプティブポータルの状態を報告できます。iOSでは、パスのステータス、インターフェースの種類、従量制(expensive)パス、および制約付き(constrained)パスを報告します。 Network.framework.

const result = await NetworkDiagnostics.testUrl({
url: 'https://api.example.com/health',
method: 'HEAD',
timeoutMs: 5000,
followRedirects: true,
});
if (!result.reachable) {
console.warn(result.errorCode, result.errorMessage);
}

バックエンドの実際のヘルスチェックエンドポイントを使用してください。ブラウザのみのチェックは、WebView、CORS、プロキシ、またはキャプティブポータルの挙動によって隠蔽される可能性がありますが、このプラグインはネイティブのネットワーク機能を使用します。

const port = await NetworkDiagnostics.testPort({
host: 'api.example.com',
port: 443,
timeoutMs: 3000,
});
console.log(port.open, port.durationMs);

これは、Wi-Fiアクセスポイントが通常のブラウジングは許可しているものの、非標準ポート、MQTT、カスタムゲートウェイ、またはプライベートなバックエンドをブロックしている場合に非常に有用です。

const socket = await NetworkDiagnostics.testWebSocket({
url: 'wss://ws.example.com/socket',
timeoutMs: 5000,
});
console.log(socket.open, socket.statusCode);

プロキシやキャプティブポータルがHTTPSは許可しているものの、WebSocketのアップグレードリクエストをブロックする場合に使用します。

const speed = await NetworkDiagnostics.testDownloadSpeed({
url: 'https://speed.example.com/5mb.bin',
maxBytes: 5 * 1024 * 1024,
timeoutMs: 30000,
});
console.log(speed.mbps);

アプリが必要とするネットワークパスを正確に反映させるため、独自の静的ファイルエンドポイントを使用してください。

const loss = await NetworkDiagnostics.testPacketLoss({
mode: 'tcp',
host: 'api.example.com',
port: 443,
count: 10,
timeoutMs: 3000,
intervalMs: 250,
});
console.log(loss.lossPercent);

App StoreやPlay Storeのアプリでは、生のICMP pingは利用できません。このメソッドは、TCPまたはHTTPプローブを繰り返すことで、アプリケーションレベルのパケットロスを測定します。

Web版の実装は開発用です。ブラウザはraw TCPソケットを開けず、URLチェックはCORSの制限を受ける場合があります。実際のサポート診断にはiOSまたはAndroidのビルドを使用してください。