首先，我一直在尝试在 Flutter 中获取 HTTP 请求，而我没有 JavaScript 经验。

一个网站只提供了一个JavaScript示例代码，但我不知道如何将它用于Flutter。

https://kodestat.gitbook.io/flutter/flutter-http-requests-and-rest-api

我尝试了上面的链接但失败了。

我知道我必须像这样插入 URL 和 ServiceKey。

class HomePageState extends State<HomePage> {

  //this async func will get data from the internet
  //when our func is done we return a string
  Future<String> getData() async {
    //we have to wait to get the data so we use 'await'
    http.Response response = await http.get(
      //Uri.encodeFull removes all the dashes or extra characters present in our Uri
      Uri.encodeFull("URL"),
      headers: {
        //if your api require key then pass your key here as well e.g "key": "my-long-key"
       "Accept": "application/json" 
       "key": "my-long-key"
      }
    );

    //print(response.body);

    List data = json.decode(response.body);
    //print(data);
    print(data[1]["title"]);
  }

但是我应该如何处理 Flutter 中的 encodeURIComponent 和其他函数来获取 HTTP 请求？

这是 JavaScript 示例代码。

var xhr = new XMLHttpRequest();
var url = 'http://openapi.tago.go.kr/openapi/service/ArvlInfoInqireService/getSttnAcctoArvlPrearngeInfoList'; /*URL*/
var queryParams = '?' + encodeURIComponent('ServiceKey') + '='+'ServiceKey'; /*Service Key*/
queryParams += '&' + encodeURIComponent('cityCode') + '=' + encodeURIComponent('25'); /*CityCode*/
queryParams += '&' + encodeURIComponent('nodeId') + '=' + encodeURIComponent('DJB8001793ND'); /*nodeID*/
xhr.open('GET', url + queryParams);
xhr.onreadystatechange = function () {
    if (this.readyState == 4) {
        alert('Status: '+this.status+' Headers: '+JSON.stringify(this.getAllResponseHeaders())+' Body: '+this.responseText);
    }
};

xhr.send('');

最佳答案

有一个 dart 包提供了一些 http 请求的辅助类。

Github:https://github.com/Ephenodrom/Dart-Basic-Utils 安装它:

dependencies:
  basic_utils: ^1.3.0

用法

Map<String, String> headers = {
  "Accept": "application/json",
  "key": "my-long-key"
};
Map<String, String> queryParameters = {
  "citycode": Uri.encodeFull("25"),
  "nodeId": Uri.encodeFull("123456789")
};

String URL = Uri.encodeFull("URL");
// If the api returns json
Map<String, dynamic> dataAsJson = await HttpUtils.getForJson(url,
      headers: headers, queryParameters: queryParameters);
// if the api returns plain strings
String dataAsString = await HttpUtils.getForString(url,
      headers: headers, queryParameters: queryParameters);
// if the api returns something else like XML, EPP, KV, YAML 
Response fullResponse = await HttpUtils.getForFullResponse(url,
      headers: headers, queryParameters: queryParameters);

对查询参数数据使用 Uri.encodeFull。

附加信息:

这些都是来自 HttpUtils 类的方法。

Future<Map<Response> getForFullResponse(String url,{Map<String, dynamic> queryParameters,Map<String, String> headers});
Future<Map<String, dynamic>> getForJson(String url,{Map<String, dynamic> queryParameters,Map<String, String> headers});
Future<String> getForString(String url,{Map<String, dynamic> queryParameters,Map<String, String> headers});
Future<Map<Response> postForFullResponse(String url, String body,{Map<String, String> queryParameters,Map<String, String> headers});
Future<Map<String, dynamic>> postForJson(String url, String body,{Map<String, String> queryParameters,Map<String, String> headers});
Future<String> postForString(String url, String body,{Map<String, String> queryParameters,Map<String, String> headers});
Future<Response> putForFullResponse(String url, String body,{Map<String, String> queryParameters,Map<String, String> headers});
Future<Map<String, dynamic>> putForJson(String url, String body,{Map<String, String> queryParameters,Map<String, String> headers});
Future<String> putForString(String url, String body,{Map<String, String> queryParameters,Map<String, String> headers});
Future<Response deleteForFullResponse(String url,{Map<String, String> queryParameters,Map<String, String> headers});
Future<Map<String, dynamic>> deleteForJson(String url,{Map<String, String> queryParameters,Map<String, String> headers});
Future<String> deleteForString(String url,{Map<String, String> queryParameters,Map<String, String> headers});
Map<String, dynamic> getQueryParameterFromUrl(String url);
String addQueryParameterToUrl(String url, Map<String, dynamic> queryParameters);

关于javascript - Flutter 中的 HTTP 请求和 Rest API，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56958958/