Getting Started
このプラグインのインストール手順と完全なマークダウンガイドを含む設定プロンプトをコピーする
Set up this Capacitor plugin in the project.
Use the package manager already used by the project.
Install these package(s): `@capgo/capacitor-network-diagnostics`
Run the required Capacitor sync/update step after installation.
Read this markdown guide for the full setup steps: https://raw.githubusercontent.com/Cap-go/website/refs/heads/main/apps/docs/src/content/docs/docs/plugins/network-diagnostics/getting-started.mdx
Use that guide for platform-specific steps, native file edits, permissions, config changes, imports, and usage setup.
If that guide references other docs pages, read them too.
インストール
「インストール」というセクションAIアシスタントセットアップを使用してプラグインをインストールできます。AIツールにCapgoスキルを追加するには、以下のコマンドを実行してください。
npx 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.Manualセットアップを使用する場合は、以下のコマンドを実行してプラグインをインストールし、以下のプラットフォーム固有の指示に従ってください。
bun add @capgo/capacitor-network-diagnosticsbunx cap syncインポート
「インポート」をタイトルにしたセクションimport { NetworkDiagnostics } from '@capgo/capacitor-network-diagnostics';完全な診断レポートを実行
「完全な診断レポートを実行」をタイトルにしたセクションrunDiagnostics __CAPGO_KEEP_0__のサポートレポートを収集するために、ユーザーが制限されたネットワークにいる場合、最速の方法はこれです。
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は、パス状態、インターフェイスタイプ、コストのかかるパス、制限されたパスを通じて Network.framework.
APIの到達可能性をテスト
「APIの到達可能性をテスト」をタイトルにしたセクション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、プロキシ、またはキャプティブポータル動作によって隠される可能性がありますが、このプラグインはネイティブネットワーキングを使用します。
TCPポートをテスト
セクション「TCPポートをテスト」const port = await NetworkDiagnostics.testPort({ host: 'api.example.com', port: 443, timeoutMs: 3000,});
console.log(port.open, port.durationMs);Wi-Fiアクセスポイントが標準以外のポート、MQTT、カスタムゲートウェイ、またはプライベートバックエンドをブロックしながら通常のブラウジングを許可している場合に便利です。
WebSocket接続性をテスト
セクション「WebSocket接続性をテスト」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アプリでは、RAW ICMP パングは移植性が低いため、この方法はTCPまたはHTTPプローブを繰り返してアプリケーションレベルのパケットロスを測定します。
Web fallback
「Web fallback」のセクションWeb実装は開発用意されています。ブラウザではRAW TCPソケットを開くことができず、URLチェックはCORSの制限により制限されるため、iOSまたはAndroidビルドを使用して実際のサポート診断を行うことをお勧めします。