一尘不染

Flutter:获取HTML页面的某些元素

flutter

我最近开始使用飞镖和扑扑开发用于动物收容所的应用程序,但遇到了问题。

想法是有一个捐赠页面,用户可以在其中选择为狗买食物。打开的脚手架将显示食物的图片,并从销售所述食物的网站和当前
价格中获取一些数据。该图像作为资产存储在本地,但是我想至少从网站上获取价格,因此它始终是最新的。

我按照flutter.io上的教程进行操作,但是问题是http.get返回网站的整个代码,而不仅仅是我指定的部分(description_tab)。我尝试检查async&dart:convert文档,但到目前为止,我还没有发现任何可以使用div标签从HTML站点抓取特定内容的内容。

完整的代码可以在这里找到:https ://github.com/kergefarkas/osszefogasaszanhuzokert

这就是我能够获取网站的整个HTML代码的方式:

Future<JoseraAdultActive> fetchPost() async {
  final response = await http.get(
      'https://www.petissimo.hu/kutyaknak/szarazeledelek/josera/josera-active.html');
  final json = JSON.decode(response.body);

  return new JoseraAdultActive.fromJson(json);
}

class JoseraAdultActive {
  final String description;
  final String price;

  JoseraAdultActive({this.description, this.price});

  factory JoseraAdultActive.fromJson(Map<String, dynamic> json) {
    return new JoseraAdultActive(
        description: json['description_tab'],
        price: json['product_price_from']);
  }
}

And this is where I would display the extracted information:

new Container(
                    padding: const EdgeInsets.only(top: 10.0, right: 5.0),
                    child: new FutureBuilder<JoseraAdultActive>(
                        future: fetchPost(),
                        builder: (context, snapshot) {
                          if (snapshot.hasData) {

                            return new Text('');
                          } else if (snapshot.hasError) {
                            return new Text('Error');
                          }
                          return new CircularProgressIndicator();
                        })),

我还认为JSON.decode不能与HTML代码一起使用,但是找不到任何可以使用的东西。尝试通过子字符串对其进行切片也不起作用。

感谢您的任何帮助!


阅读 615

收藏
2020-08-13

共1个答案

一尘不染

为了进一步表达Seth的意见,您应该可以使用html库。

看起来应该像这样:

import 'package:html/parser.dart' show parse;
import 'package:html/dom.dart';

var document = parse(response.body);
var priceElement = document.getElementsByClassName("product_price_from");
// priceElement may have weird formatting (I see &nbsp;) so you might need to do some parsing
// here to solve that

我还建议您学习正则表达式(RegEx),因为它们也可以很简单地解决此问题,并且对各种编程问题都非常有用。这是dart的regex文档和常规RegEx教程的链接。

话虽如此,该代码将取决于URL的更改,网站的更改或关闭,该特定产品不再销售,将使用用户的数据以及许多其他因素,这些因素可能会或可能不会受到您的控制-因此即使将其仅用于庇护所的应用程序,我也不太乐意将其放入生产代码中。至少要确保它具有安全的回退(即回退到当前价格11500 Ft)。

我会仔细考虑一下这是否确实有必要,而不是每年/当价格发生变化时自己每年更新一次。或者,如果您的应用程序具有服务器后端(甚至可以访问庇护所的网站-您可以将页面放置在housing.com / donationprices / joseraadultactive中,仅返回“ 11499”),建议您将此参数作为参数该应用程序可以检索您可以更新的信息(如果您绝对希望自动完成该操作,则可以每天在服务器上运行一次任务以检索最新价格)。另外,我不知道庇护所如何在您所在的地方工作,但我居住的地方往往会大量购买散装食品,或者在何时购买
在销售中,一袋食物的价格有些无关紧要-那时,您可能只需要带有一个袋子图片和任意价格的捐赠按钮,您可能会得到与捐赠一样多的捐赠,还有更多而不是应用程序有问题。

2020-08-13