Flutter原生网络请求适配插件native_dio_adapter的使用

Native Dio Adapter

注意: 此插件在macOS、iOS和Android上使用原生HTTP实现。其他平台仍然使用Dart HTTP栈。

native_dio_adapter是Dio的一个客户端，它利用了cupertino_http和cronet_http，将HTTP请求委托给原生平台而不是dart:io平台。

灵感来源于Dart 2.18发布博客。

动机

使用原生平台实现，而非基于套接字的dart:io HttpClient实现，有以下几个优点：

• 自动支持平台特性，如VPN和HTTP代理。
• 支持更多的配置选项，例如只允许通过WiFi访问和阻止Cookie。
• 支持更多HTTP特性，如HTTP/3和自定义重定向处理。

开始使用

安装

在您的pubspec.yaml文件中添加native_dio_adapter包到依赖项中。

dependencies:
  native_dio_adapter: ^latest_version # 替换为最新版本号

示例代码

以下是一个完整的Flutter应用示例，展示了如何使用native_dio_adapter进行GET和POST请求：

// ignore_for_file: use_build_context_synchronously

import 'dart:convert';

import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:native_dio_adapter/native_dio_adapter.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  void _doGetRequest() async {
    final dio = Dio();

    dio.httpClientAdapter = NativeAdapter(
      createCupertinoConfiguration: () =>
          URLSessionConfiguration.ephemeralSessionConfiguration()
            ..allowsCellularAccess = false
            ..allowsConstrainedNetworkAccess = false
            ..allowsExpensiveNetworkAccess = false,
    );
    try {
      final response = await dio.get<String>('https://flutter.dev');
      await showDialog<void>(
        context: context,
        builder: (context) {
          return AlertDialog(
            title: Text('Response ${response.statusCode}'),
            content: SingleChildScrollView(
              child: Text(response.data ?? 'No response'),
            ),
            actions: [
              MaterialButton(
                onPressed: () => Navigator.pop(context),
                child: const Text('Close'),
              )
            ],
          );
        },
      );
    } catch (e) {
      print(e);
    }
  }

  void _doPostRequest() async {
    final dio = Dio();

    dio.httpClientAdapter = NativeAdapter(
      createCupertinoConfiguration: () =>
          URLSessionConfiguration.ephemeralSessionConfiguration()
            ..allowsCellularAccess = false
            ..allowsConstrainedNetworkAccess = false
            ..allowsExpensiveNetworkAccess = false,
    );
    try {
      final response = await dio.post<String>(
        'https://httpbin.org/post',
        queryParameters: {'foo': 'bar'},
        data: jsonEncode({'foo': 'bar'}),
        options: Options(headers: {'foo': 'bar'}),
      );

      await showDialog<void>(
        context: context,
        builder: (context) {
          return AlertDialog(
            title: Text('Response ${response.statusCode}'),
            content: SingleChildScrollView(
              child: Text(response.data ?? 'No response'),
            ),
            actions: [
              MaterialButton(
                onPressed: () => Navigator.pop(context),
                child: const Text('Close'),
              )
            ],
          );
        },
      );
    } catch (e) {
      print(e);
    }
  }

  void _doHttpClientRequest() async {
    final config = URLSessionConfiguration.ephemeralSessionConfiguration()
      ..allowsCellularAccess = false
      ..allowsConstrainedNetworkAccess = false
      ..allowsExpensiveNetworkAccess = false;
    final client = CupertinoClient.fromSessionConfiguration(config);
    try {
      final response = await client.get(Uri.parse('https://flutter.dev/'));
      await showDialog<void>(
        context: context,
        builder: (context) {
          return AlertDialog(
            title: Text('Response ${response.statusCode}'),
            content: SingleChildScrollView(
              child: Text(response.body),
            ),
            actions: [
              MaterialButton(
                onPressed: () => Navigator.pop(context),
                child: const Text('Close'),
              )
            ],
          );
        },
      );
    } catch (e) {
      print(e);
    }
  }

  void _doHttpClientPostRequest() async {
    final config = URLSessionConfiguration.ephemeralSessionConfiguration()
      ..allowsCellularAccess = false
      ..allowsConstrainedNetworkAccess = false
      ..allowsExpensiveNetworkAccess = false;
    final client = CupertinoClient.fromSessionConfiguration(config);

    try {
      final response = await client.post(
        Uri.parse('https://httpbin.org/post'),
        body: jsonEncode({'foo': 'bar'}),
      );

      await showDialog<void>(
        context: context,
        builder: (context) {
          return AlertDialog(
            title: Text('Response ${response.statusCode}'),
            content: SingleChildScrollView(
              child: Text(response.body),
            ),
            actions: [
              MaterialButton(
                onPressed: () => Navigator.pop(context),
                child: const Text('Close'),
              )
            ],
          );
        },
      );
    } catch (e) {
      print(e);
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        mainAxisSize: MainAxisSize.max,
        children: [
          ElevatedButton(
            onPressed: _doGetRequest,
            child: const Text('make get request'),
          ),
          ElevatedButton(
            onPressed: _doPostRequest,
            child: const Text('make post request'),
          ),
          ElevatedButton(
            onPressed: _doHttpClientRequest,
            child: const Text('make client request'),
          ),
          ElevatedButton(
            onPressed: _doHttpClientPostRequest,
            child: const Text('make client post request'),
          ),
        ],
      ),
    );
  }
}

这个示例展示了如何使用native_dio_adapter执行基本的GET和POST请求，并显示响应结果。您可以通过点击按钮来触发这些请求，并在弹出的对话框中查看响应内容。

使用嵌入式Cronet

从cronet_http v1.2.0开始，您可以使用嵌入式的Cronet实现，只需简单地配置dart-define。详情请参阅cronet_http文档。

希望这个指南能帮助您更好地理解和使用native_dio_adapter！如果您有任何问题或需要进一步的帮助，请随时提问。