Flutter Web 发送 POST 请求及参数传递教程

Flutter Web 发送 POST 请求及参数传递教程

在 Flutter Web 开发中，发送 POST 请求并传递参数是常见的需求。本文将为您提供详细的步骤和代码示例，帮助您快速掌握。

使用 http 包发送 POST 请求

Flutter 提供了强大的 http 包来处理网络请求。您可以使用 http.post 方法发送 POST 请求，并传递参数。

以下是使用 http.post 发送 POST 请求并传递参数的示例：

import 'package:http/http.dart' as http;

void postData() async {
  // 定义目标 URL
  var url = Uri.parse('http://example.com/api');

  // 定义请求头
  var headers = {'Content-Type': 'application/json'};

  // 定义请求体
  var body = '{'param1': 'value1', 'param2': 'value2'}';

  // 发送 POST 请求
  var response = await http.post(url, headers: headers, body: body);

  // 处理响应
  if (response.statusCode == 200) {
    // 请求成功
    print('请求成功');
    print(response.body);
  } else {
    // 请求失败
    print('请求失败');
  }
}

代码解析:

1. 首先，我们导入了 http 包。
2. 接着，我们定义了目标 URL url，这里使用 Uri.parse() 方法将字符串转换为 Uri 对象。
3. 然后，我们定义了请求头 headers，指定内容类型为 JSON 格式。
4. 接下来，我们定义了请求体 body，这里使用 JSON 字符串的形式。
5. 最后，我们调用 http.post() 方法发送 POST 请求，并传递 URL、请求头和请求体作为参数。
6. 根据响应状态码 statusCode 判断请求是否成功，并进行相应的处理。

传递表单数据

如果您需要以表单形式传递参数，可以使用 http.MultipartRequest 类构建请求体。

import 'package:http/http.dart' as http;

void postFormData() async {
  var url = Uri.parse('http://example.com/api');
  var request = http.MultipartRequest('POST', url);
  request.fields['param1'] = 'value1';
  request.fields['param2'] = 'value2';

  var response = await request.send();

  if (response.statusCode == 200) {
    print('请求成功');
    print(await response.stream.bytesToString());
  } else {
    print('请求失败');
  }
}

总结

本文介绍了在 Flutter Web 中发送 POST 请求并传递参数的方法。您可以根据实际需求选择不同的方式进行参数传递。