Passer à la navigation

Prise en main

GitHub

Vous pouvez utiliser notre configuration assistée par l'IA pour installer le plugin. Ajoutez les Capgo compétences à votre outil IA en utilisant la commande suivante :

Fenêtre de terminal
npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

Ensuite, utilisez la prompt suivante :

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

Si vous préférez la configuration manuelle, installez le plugin en exécutant les commandes suivantes et suivez les instructions spécifiques à la plateforme ci-dessous :

Fenêtre de terminal
npm install @capgo/capacitor-network-diagnostics
npx cap sync
import { NetworkDiagnostics } from '@capgo/capacitor-network-diagnostics';

runDiagnostics c'est la meilleure façon de collecter un rapport de support pour un utilisateur sur un réseau restreint.

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);

Les drapeaux exacts dépendent de la plateforme. Android peut signaler l'état de l'internet validé et de la porte de captivité. iOS signale l'état de la voie, le type d'interface, les chemins coûteux et les chemins contraints à travers 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);
}

Utilisez un point de terminaison de santé réel provenant de votre backend. Un contrôle de la santé effectué uniquement par le navigateur peut être masqué par WebView, CORS, proxy ou comportement de portal captif, tandis que ce plugin utilise le réseau natif.

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

Cela est utile lorsque le point d'accès Wi-Fi bloque les ports non standards, MQTT, les passerelles personnalisées ou un backend privé tout en permettant la navigation normale.

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

Utilisez cela lorsque les proxies ou les portails captifs autorisent les pages HTTPS mais bloquent les demandes d'amélioration WebSocket.

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

Utilisez votre propre point de terminaison de fichiers statiques afin que le résultat reflète le chemin réseau dont votre application a besoin.

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

Le ping ICMP brut n'est pas portable dans les applications App Store et Play Store. Cette méthode mesure la perte de paquets au niveau de l'application en répétant des sondes TCP ou HTTP.

La mise en œuvre web est destinée au développement. Les navigateurs ne peuvent pas ouvrir des sockets TCP bruts, et les vérifications d'URL peuvent être limitées par CORS. Utilisez des builds iOS ou Android pour des diagnostics de support réels.