flutter如何检测网络状态

在Flutter中，如何实时检测设备的网络连接状态？比如判断当前是否有网络连接，或者监听网络状态的变化（从WiFi切换到移动数据等）。有没有推荐的方式或插件来实现这个功能？最好能提供简单的代码示例。

2 回复

使用Flutter检测网络状态，推荐使用connectivity_plus包。监听网络变化并获取当前状态，如WiFi、移动数据或无网络。

更多关于flutter如何检测网络状态的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在Flutter中检测网络状态，可以使用 connectivity_plus 包。以下是实现步骤：

1. 添加依赖

在 pubspec.yaml 中添加：

dependencies:
  connectivity_plus: ^5.0.2

运行 flutter pub get 安装。

2. 基本使用

import 'package:connectivity_plus/connectivity_plus.dart';

// 检查当前网络状态
Future<void> checkConnectivity() async {
  final connectivityResult = await Connectivity().checkConnectivity();
  if (connectivityResult == ConnectivityResult.mobile) {
    print('移动网络');
  } else if (connectivityResult == ConnectivityResult.wifi) {
    print('WiFi网络');
  } else if (connectivityResult == ConnectivityResult.none) {
    print('无网络');
  }
}

3. 监听网络变化

StreamSubscription<ConnectivityResult>? subscription;

void listenNetwork() {
  subscription = Connectivity().onConnectivityChanged.listen((result) {
    // 网络状态变化时触发
    print('网络变为: $result');
  });
}

// 取消监听
void cancelListen() {
  subscription?.cancel();
}

4. 完整示例

import 'package:flutter/material.dart';
import 'package:connectivity_plus/connectivity_plus.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String _status = '检查中...';

  @override
  void initState() {
    super.initState();
    _checkNetwork();
    Connectivity().onConnectivityChanged.listen(_updateStatus);
  }

  void _checkNetwork() async {
    var result = await Connectivity().checkConnectivity();
    _updateStatus(result);
  }

  void _updateStatus(ConnectivityResult result) {
    setState(() {
      _status = result.toString().split('.').last;
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(child: Text('网络状态: $_status')),
      ),
    );
  }
}

注意事项：

  • 需要网络权限（Android 在 AndroidManifest.xml 添加 <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>）
  • iOS 无需额外配置
  • 仅检测网络连接类型，不保证一定能访问互联网

对于更精确的互联网可达性检测，建议结合 http 包尝试访问特定服务器。

回到顶部