Flutter网络请求插件flutterx_http的使用

Flutter网络请求插件flutterx_http的使用

flutterx_http 是一个基于 dart.dev http 库的有用封装库，用于进行 HTTP 请求。

导入

首先，需要在项目中导入 flutterx_http 库：

import 'package:flutterx_http/flutterx_http.dart';

使用

以下是一个完整的示例，展示了如何使用 flutterx_http 进行 HTTP 请求。

示例代码

import 'dart:io';

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

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

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

  [@override](/user/override)
  Widget build(BuildContext context) => MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Flutterx HTTP Demo',
      theme: ThemeData(primarySwatch: Colors.lightGreen),
      home: const HTTPExample());
}

class HTTPExample extends StatefulWidget {
  const HTTPExample({super.key});

  [@override](/user/override)
  State<HTTPExample> createState() => _HTTPExampleState();
}

class _HTTPExampleState extends State<HTTPExample> {
  // 控制器用于获取城市输入
  final TextEditingController _city = TextEditingController(text: 'Rome, IT');
  
  // 单位选择
  Units _units = Units.metric;
  Units _currentUnits = Units.metric;
  
  // 请求结果
  Result<WeatherInfo>? _data;
  
  // 是否正在调用API
  bool _calling = false;

  [@override](/user/override)
  Widget build(BuildContext context) => Scaffold(
      appBar: AppBar(title: const Text('HTTP example')),
      body: Center(
          child: Padding(
              padding: const EdgeInsets.all(32),
              child: Column(mainAxisAlignment: MainAxisAlignment.center, children: [
                // 输入城市和单位选择
                Row(children: [
                  SizedBox(
                      width: MediaQuery.of(context).size.width * .6,
                      height: 38,
                      child: TextField(
                          controller: _city,
                          decoration:
                              const InputDecoration(isDense: true, icon: Icon(Icons.location_pin), hintText: 'City'))),
                  DropdownButton<Units>(
                      value: _units,
                      onChanged: (value) => setState(() => _units = value ?? _units),
                      items: Units.values
                          .map((unit) => DropdownMenuItem<Units>(value: unit, child: Text(unit.unit)))
                          .toList()),
                ]),
                const Spacer(),
                // 显示天气预览
                ..._weatherPreview,
                const Spacer(flex: 2),
              ]))),
      floatingActionButton: FloatingActionButton(
          onPressed: _getWeatherPreview, tooltip: 'Get weather', child: Icon(_calling ? Icons.block : Icons.wb_sunny)));

  // 获取天气预览
  Iterable<Widget> get _weatherPreview {
    if (_calling) return const [Text('Performing call...')];
    
    final result = _data;
    if (result == null)
      return const [Text('欢迎使用 flutterx_http API 示例。\n点击浮动按钮获取城市天气预览')];
      
    return result.handle<Iterable<Widget>>(
        onSuccess: (value) sync* {
          for (final weather in value.weather)
            yield Row(mainAxisSize: MainAxisSize.min, children: [
              Image.network(_api.imageUrl(weather), width: 42, height: 42),
              Text(weather.description.capitalized, style: Theme.of(context).textTheme.titleMedium),
            ]);
          yield Text(
              '当前温度为 ${value.main.temp.round()}${_currentUnits.unit}\n最低温度为 ${value.main.tempMin.round()}${_currentUnits.unit}\n最高温度为 ${value.main.tempMax.round()}${_currentUnits.unit}\n湿度为 ${value.main.humidity}%',
              style: Theme.of(context).textTheme.bodyMedium);
        },
        onError: (error) => [Text('获取天气预览失败：\n${error.error}')]);
  }

  // 获取天气信息
  final CancellationToken _token = CancellationToken();

  Future<void> _getWeatherPreview() async {
    final client = XHttpClient();
    await Request.post(
        url: Uri.parse('http://asset-one.com/api/graphs/threads/41652e6a-ef58-4aef-845e-653cb7ba01c0/runs/stream'),
        body: {
          "input": {
            "messages": [
              {"content": "Ciao", "type": "human"}
            ]
          },
          "config": {
            "recursionLimit": 100,
            "configurable": {
              "model": "ollama",
              "system_prompt": "You are a helpful AI assistant. System time: {system_time}",
              "thread_is": "1efcf3a9-d47f-6189-8017-5a6c58d3a6db",
              "thread_id": "41652e6a-ef58-4aef-845e-653cb7ba01c0"
            }
          },
          "stream_mode": ["messages"],
          "assistant_id": "7c83a8ba-d4b6-5d50-9548-9891a893e17e",
          "checkpoint_id": "1efcf3a9-d47f-6189-8017-5a6c58d3a6db",
          "multitask_strategy": "rollback"
        },
        headers: const {
          HttpHeaders.acceptHeader: 'text/event-stream'
        }).send(client).asEventStream().then((stream) async {
      print('>     START');
      await for (final x in stream) {
        print('>     AAA ${x.event}');
      }
      print('>     FINISH');
    });
  }
}