メインコンテンツへスキップ
@capgo/capacitor-network-diagnostics 開発者ツール オープンソース

ネットワーク診断 Capacitor プラグイン

URL の到達可能性、TCP ポート、WebSocket ハンドシェイク、速度、パケットロスに対するネイティブネットワーク診断を実行します

インストール

bun add @capgo/capacitor-network-diagnostics bunx cap sync
npm、pnpm、または yarn
  • npm install @capgo/capacitor-network-diagnostics
  • pnpm add @capgo/capacitor-network-diagnostics
  • yarn add @capgo/capacitor-network-diagnostics

ガイド

Capacitor で Network Diagnostics を使う方法

@capgo/capacitor-network-diagnostics の使い方

制限付き Wi-Fi、キャプティブポータル、ポートのブロック、WebSocket の失敗、低速ダウンロード、パケットロスなどをデバッグする必要がある Capacitor アプリ向けのネイティブネットワーク診断。

インストール

npm install @capgo/capacitor-network-diagnostics
npx cap sync

このプラグインで利用可能な機能

  • getNetworkStatus - ネイティブの接続タイプとプラットフォームのネットワークフラグを読み取ります。
  • testUrl - HTTP/HTTPS URL の到達性を、ステータス code とレイテンシで確認します。
  • testPort - ホストとポートに対してネイティブ TCP ソケットを開きます。
  • testWebSocket - 次を検証します: ws:// または wss:// ハンドシェイク。
  • testDownloadSpeed - ネイティブのダウンロードスループットを測定します。
  • testPacketLoss - 繰り返しプローブして、アプリケーション層のパケット損失を推定します。
  • runDiagnostics - 統合診断を実行し、問題のリストを返します。

使用例

import { NetworkDiagnostics } from '@capgo/capacitor-network-diagnostics';

const report = await NetworkDiagnostics.runDiagnostics({
  urls: [{ url: 'https://api.example.com/health' }],
  ports: [{ host: 'api.example.com', port: 443 }],
  websockets: [{ url: 'wss://ws.example.com/socket' }],
  packetLoss: {
    mode: 'tcp',
    host: 'api.example.com',
    port: 443,
    count: 10,
  },
});

console.log(report.status);
console.log(report.issues);

サポートワークフロー

問題のあるWi-Fiまたはアクセスポイントに接続した状態で、影響を受けているユーザーに診断の実行を依頼してください。結果は次の情報を添えてサポートに送信してください:

  • 接続タイプとOSのネットワークフラグ
  • 失敗したURL、ポート、またはWebSocketエンドポイント
  • ダウンロード速度 (Mbps)
  • パケットロス率
  • ネイティブエラーコードとメッセージ

Raw ICMP pingはiOS/Androidアプリではそのまま使えないため、パケットロスはTCPまたはHTTPプローブを繰り返して測定します。

リファレンス全文

よくある質問

Network Diagnostics プラグイン FAQ

Capacitor アプリに Network Diagnostics プラグインをインストールするにはどうすればよいですか?

"bun add @capgo/capacitor-network-diagnostics"(または "npm install @capgo/capacitor-network-diagnostics")を実行し、続けて "bunx cap sync" を実行して、iOS と Android プロジェクトにネイティブの code を反映させます。アプリの code で "@capgo/capacitor-network-diagnostics" からインポートしてください。

@capgo/capacitor-network-diagnostics は React、Vue、Angular で動作しますか?

はい。Network DiagnosticsはCapacitorパッケージなので、Ionic、React、Vue、Angular、Svelte、素のJavaScriptなど、Capacitor内で動作するあらゆるWebフレームワークで使えます。

@capgo/capacitor-network-diagnosticsはどのCapacitorバージョンをサポートしていますか?

Capgo プラグインは Capacitor のメジャーバージョンに合わせています。使用している Capacitor のメジャーバージョンに一致するプラグインのメジャーバージョンを使ってください (例: Capacitor 8 ならプラグイン v8)。GitHub の README にある互換性テーブルに、メンテナンス中のバージョンが記載されています。

@capgo/capacitor-network-diagnosticsは無料でオープンソースですか?

はい。ソースcodeはGitHub上で https://github.com/Cap-go/capacitor-network-diagnostics/ に公開されており、パッケージはnpmから無料でインストールできます。バグ報告やプルリクエストも歓迎します。

App Storeの審査を通さずに、Network Diagnosticsを使用しているcodeをアップデートできますか?

プラグインのインストールやアップグレードはネイティブの code を変更するため、新しいストアビルドが必要です。その後は、プラグインを呼び出す JavaScript、HTML、CSS の変更を Capgo Live Updates で即座に配信できます。

アプリ審査を待たずに Network Diagnostics の変更を配信

プラグインをストア用ビルドに組み込めば、Capgo live updates で JavaScript、HTML、CSS の変更を数分でユーザーに配信できます

Capgo から始める