[flutter] 플러터 앱의 웹 크롤링 (Web Scraping) 처리 방법

플러터(Flutter)는 구글에서 개발한 모바일 애플리케이션 프레임워크로, 다양한 플랫폼에서 동작하는 앱을 개발할 수 있습니다. 이번에는 플러터 앱에서 웹 크롤링(Web Scraping)을 처리하는 방법에 대해 알아보겠습니다.

1. flutter_webview_plugin 사용하기

가장 간단하고 일반적인 웹 크롤링 방법은 flutter_webview_plugin 패키지를 사용하는 것입니다. 이 패키지를 이용하여 웹사이트를 불러와서 크롤링할 수 있습니다. 다음은 flutter_webview_plugin을 사용하는 방법입니다.

먼저, pubspec.yaml 파일에 flutter_webview_plugin 패키지를 추가합니다.

dependencies:
  flutter_webview_plugin: ^0.3.10

그리고 WebView 위젯을 사용하여 앱에서 웹뷰를 보여줍니다.

import 'package:flutter_webview_plugin/flutter_webview_plugin.dart';
import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Web Crawling App',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: WebPage(),
    );
  }
}

class WebPage extends StatelessWidget {
  final String url = 'https://example.com';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Web Crawling')),
      body: Container(
        child: WebView(
          initialUrl: url,
          javascriptMode: JavascriptMode.unrestricted,
        ),
      ),
    );
  }
}

위 코드에서는 WebView 위젯을 사용하여 https://example.com의 웹페이지를 보여줍니다. 이제 앱에서 해당 웹페이지를 로드하면 사용자는 웹페이지를 볼 수 있습니다.

2. html 패키지를 사용하여 웹 텍스트 추출하기

만약 특정 웹사이트에서 텍스트 정보를 추출하고자 한다면, html 패키지를 사용할 수 있습니다. html 패키지는 HTML 문서를 파싱하고 원하는 요소를 추출하는 기능을 제공합니다. 다음은 html 패키지를 사용하여 웹페이지에서 특정 요소를 추출하는 방법입니다.

먼저, pubspec.yaml 파일에 html 패키지를 추가합니다.

dependencies:
  html: ^0.14.0+3

그리고 다음과 같이 코드를 작성하여 웹 텍스트를 추출합니다.

import 'package:flutter/material.dart';
import 'package:html/parser.dart' as parser;
import 'package:http/http.dart' as http;
import 'package:html/dom.dart' as dom;

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  final String url = 'https://example.com';

  Future<dom.Document> fetchHTML() async {
    final response = await http.get(Uri.parse(url));
    return parser.parse(response.body);
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Web Scraping App',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(title: const Text('Web Scraping')),
        body: FutureBuilder<dom.Document>(
          future: fetchHTML(),
          builder: (BuildContext context, AsyncSnapshot<dom.Document> snapshot) {
            if (snapshot.hasData) {
              final title = snapshot.data!.querySelector('title')?.text ?? 'No Title';
              return Center(child: Text('웹페이지의 제목: $title'));
            } else if (snapshot.hasError) {
              return Center(child: Text('데이터를 가져오는 동안 오류가 발생했습니다.'));
            }
            return Center(child: CircularProgressIndicator());
          },
        ),
      ),
    );
  }
}

위 코드에서는 http 패키지를 사용하여 웹페이지의 HTML을 가져오고, html 패키지를 사용하여 제목 요소를 추출합니다. 추출한 제목을 앱 화면에 표시합니다.

결론

위에서는 플러터 앱에서 웹 크롤링을 처리하는 두 가지 방법을 알아보았습니다. flutter_webview_plugin을 사용하면 웹페이지를 그대로 앱에서 보여줄 수 있고, html 패키지를 사용하면 특정 웹페이지에서 원하는 텍스트를 추출할 수 있습니다. 웹 크롤링을 사용하는 경우, 서비스 운영자의 권한과 웹사이트의 이용약관을 꼭 확인해야 합니다.