หนังสือ
Dart
บทที่ 11. HTML และเว็บ
การวิเคราะห์ HTML

Dart:
การวิเคราะห์ HTML

วิธีการ:

Dart ไม่มีการสนับสนุนในการแยกส่วน HTML ในไลบรารีหลักของมัน อย่างไรก็ตาม, คุณสามารถใช้แพ็คเกจของบุคคลที่สาม เช่น html เพื่อแยกส่วนและจัดการเอกสาร HTML

ก่อนอื่น, เพิ่มแพ็คเกจ html ไปยังไฟล์ pubspec.yaml ของคุณ:

dependencies:
  html: ^0.15.0

จากนั้น, นำเข้าแพ็คเกจลงในไฟล์ Dart ของคุณ:

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

นี่เป็นตัวอย่างพื้นฐานของการแยกส่วนสตริงที่มี HTML และการสกัดข้อมูล:

void main() {
  var htmlDocument = """
  <html>
    <body>
      <h1>Hello, Dart!</h1>
      <p>This is a paragraph in a sample HTML</p>
    </body>
  </html>
  """;

  // แยกส่วนสตริง HTML
  Document document = parse(htmlDocument);

  // การสกัดข้อมูล
  String title = document.querySelector('h1')?.text ?? "ไม่พบหัวข้อ";
  String paragraph = document.querySelector('p')?.text ?? "ไม่พบย่อหน้า";

  print('หัวข้อ: $title');
  print('ย่อหน้า: $paragraph');
}

ผลลัพธ์:

หัวข้อ: Hello, Dart!
ย่อหน้า: This is a paragraph in a sample HTML

เพื่อโต้ตอบกับหน้าเว็บในโลกจริง, คุณอาจจะรวมการแยกส่วน html กับการร้องขอ HTTP (โดยใช้แพ็คเกจ http เพื่อดึงเนื้อหาเว็บ) นี่คือตัวอย่างอย่างรวดเร็ว:

ก่อนอื่น, เพิ่มแพ็คเกจ http พร้อมกับ html:

dependencies:
  html: ^0.15.0
  http: ^0.13.3

จากนั้น, ดึงและแยกส่วนหน้า HTML จากเว็บ:

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

void main() async {
  var url = 'https://example.com';
  
  // ดึงเว็บเพจ
  var response = await http.get(Uri.parse(url));
  
  if (response.statusCode == 200) {
    var document = parse(response.body);

    // สมมติว่าหน้านี้มีแท็ก <h1> ที่คุณสนใจ
    var headlines = document.querySelectorAll('h1').map((e) => e.text).toList();
    
    print('ข่าวหัวข้อ: $headlines');
  } else {
    print('คำขอล้มเหลวด้วยสถานะ: ${response.statusCode}.');
  }
}

หมายเหตุ: เทคนิคการดึงข้อมูลจากเว็บที่แสดงด้านบนควรถูกใช้อย่างรับผิดชอบและตามข้อกำหนดการให้บริการของเว็บไซต์

การดาวน์โหลดหน้าเว็บส่งคำขอ HTTP