Flutter：如何显示来自响应 API 的数据 HTML 结果？答案

【问题标题】：Flutter : How to show data HTML result from response API?Flutter：如何显示来自响应 API 的数据 HTML 结果？
【发布时间】：2022-01-03 21:22:36
【问题描述】：

大家好，我有一个 HTML 格式的响应数据，我想管理数据以显示在屏幕上。我使用库flutter_html。

这是我的代码

Future<String> getHtml() async {
var headers = {
  'Cookie': 'ci_session=hgiugh'
};
var request = http.MultipartRequest('POST', Uri.parse('http://xxx/get'));
request.fields.addAll({
  '': '',
});

request.headers.addAll(headers);

final http.StreamedResponse response = await request.send();

if (response.statusCode == 200) {
  print("HTML_RESULT"+await response.stream.bytesToString());
}
else {
  print(response.reasonPhrase);
}

return await response.stream.bytesToString();}

我有 HTML，但是当我想显示它时我得到了instance of 'Future'。

显示数据的代码

var i;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    i = getHtml();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: Center(
          child: Html(
            data: i.toString(),
          ),
        ),
      ),
    );
  }

请大家帮帮我，任何参考对我都很重要，谢谢。

【问题讨论】：

您要么等待您的回复，要么使用“then”方法。您需要等待互联网服务器响应，如果没有，则无法正常工作。获得内容后，您需要更新构建的状态。
谢谢@MarianoZorrilla，你能给我一些你想要的代码吗？，

标签： flutter dart html-dataset

【解决方案1】：

尝试改变

final http.StreamedResponse response = await request.send();

为：

http.Response response = await http.Response.fromStream(await request.send());

您也必须等待 getHtml()，但不能直接在 init 上执行。

void loadResponse() async {
    final response = await getHtml();
    setState(() {
        i = response;
    });
}

然后调用init()上的方法：

@override
void initState() {
  // TODO: implement initState
  super.initState();
  loadResponse();
}

【讨论】：

感谢@João Pedro Martins，但如果我更改，我没有数据响应
我已经编辑了答案，现在试试。
仍然没有数据，我得到了“'Response'的实例”
如果你在if (response.statusCode == 200)上下断点，你能在调试停止时看到数据吗？
@Mas'udAlHafiz，当您将final http.StreamedResponse response = await request.send(); 更改为http.Response response = await http.Response.fromStream(await request.send()); 时，您还必须将getHtml() 的返回值更改为response.body 或response.bodyBytes。否则，您将获得“响应实例”。

【解决方案2】：

将此行提取为单独的代码

print("HTML_RESULT"+await response.stream.bytesToString());

喜欢

var responseString = await response.stream.bytesToString();
print("HTML_RESULT $responseString");

编辑：

正如@Mariano 所说，您需要创建新功能

void load() async {
    ... do your await here
    ... and after you got the value call
    setState(() {
        ... set your value here
    });
}

并从 initState 调用该函数

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    load();
  }

【讨论】：

我有数据，但现在我想在屏幕上显示它并拥有“未来”@cahyo 的实例

【解决方案3】：

   if (responseString == null ||
        responseString.contains("A PHP Error was encountered") ||
        responseString.contains("<div") ||
        responseString.contains("</html")) {
      Fluttertoast.showToast(
          msg: "Server Error",
          toastLength: Toast.LENGTH_SHORT,
          gravity: ToastGravity.CENTER,
          timeInSecForIosWeb: 1,
          backgroundColor: Colors.red,
          textColor: Colors.white,
          fontSize: 16.0);

    }

【讨论】：