반응형

 Flutter로 서비스를 개발하다보면, DB를 사용해야 할 일이 생긴다. 본인이 서버를 어느정도 구축할 수 있는 백엔드 프로그래밍 기술이 있다면 json형식으로 데이터를 주고 받을 수 있을 것이다. 그러나, 이 글에서는 Flutter만으로 DB와 연동하여 데이터를 주고 받는 방법을 알아볼 것이다.

 

웹에서의 DB로 직접적인 접근이 제한되는 이유

보안 DB에 직접 접근하는 것은 보안상의 위험을 초래할 수 있다. 웹 애플리케이션은 일반적으로 사용자와 상호작용하고 중요한 데이터를 처리하기 때문에, DB에 직접 접근하면 악의적인 사용자

jschan0911.tistory.com

단, 당신이 구현하고자 하는 서비스가 웹을 사용한다면 위 게시물과 같은 이유로 본 게시물의 방법은 도움이 되지 않는다.


 

 

postgres | Dart Package

PostgreSQL database driver. Supports statement reuse and binary protocol.

pub.dev

 

 가장 먼저 위 페이지에 접속하여 postgres를 다루는 패키지를 설치한다.

패키지 설치 방법이 익숙하지 않다면 이곳을 참고하시길..

 

var connection = PostgreSQLConnection("DB 호스트 주소", 포트 번호, "데이터베이스 이름", username: "username", password: "비밀번호");
await connection.open();

List<List<dynamic>> results = await connection.query("쿼리문");

pub에 작성된 글을 쉽게 풀어쓰면 위와 같다.

 

PostgreSQLConnection을 통해 DB에 관한 정보를 기입하고, connection.open()을 통해 DB와 연결한다.

다음으로 connection.query() 구문을 통해 입력된 쿼리문에 대한 결과를 반환한다.

 

참 좋은 설명이긴 한데 와닿진 않는다. 그래서 Flutter로 만든 페이지로 위 동작이 잘 구동되는지 확인해보겠다.

 

SELECT * FROM account_test

>>>
[[1, 이름, 1234, DBMS@NAVER.COM, 2023-05-12 06:15:25.086371Z, null]]

 

내가 연결하고 있는 DB는 위와 같이 작동하고 있다.

이러한 상황에서 Flutter로 어떤 버튼을 눌렀을 때, 버튼 안에 적힌 내용이 DB로부터 받아온 정보로 변하는 페이지를 개발해보았다.

 

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

class PostgresPage extends StatefulWidget {
  const PostgresPage({Key? key}) : super(key: key);

  @override
  State<PostgresPage> createState() => _PostgresPageState();
}

class _PostgresPageState extends State<PostgresPage> {
  String text = "hello";

  final String _host = '연결 중인 DB 주소';
  final int _port = 포트번호;
  final String _username = '유저 이름';
  final String _password = '비밀번호';
  final String _databaseName = '데이터베이스 이름';

  void ExecuteQuery(query) async {
    PostgreSQLConnection connection = PostgreSQLConnection(_host, _port, _databaseName, username: _username, password: _password);
    await connection.open();

    List<List<dynamic>> results = await connection.query(query);
    String _text = results[0][1];

    setState(() {
      text = _text;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Postgres 패키지 실험'),
      ),
      body: Center(
        child: ElevatedButton(
          child: Text(text),
          onPressed: () {
            String query = 'SELECT * FROM account_test';
            ExecuteQuery(query);
          },
        ),
      ),
    );
  }
}

반응형

+ Recent posts