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

Question

大家好，我有一个 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(),
          ),
        ),
      ),
    );
  }

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

Answer 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();
}

Answer 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();
  }

Answer 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);

    }

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

Flutter : How to show data HTML result from response API?

dart

flutter

html-dataset