🔖 หมวดเสริม: การเชื่อมต่อระบบ backend จริงกับแอป Flutter
📌 เหมาะสำหรับ: ผู้ที่ต้องการเชื่อมต่อแอป Flutter กับฐานข้อมูล MySQL ผ่าน API
🎯 เป้าหมาย: เข้าใจการเชื่อม Flutter กับ PHP/MySQL ด้วย HTTP request และ JSON
🧭 เกริ่นนำ
Flutter ไม่สามารถเชื่อมต่อกับฐานข้อมูล MySQL โดยตรง แต่สามารถใช้ PHP หรือ Node.js เขียน REST API เพื่อให้ Flutter ดึงข้อมูลผ่าน HTTP ได้ ซึ่งเป็นแนวทางมาตรฐานในการพัฒนาแอปที่มี backend จริง
🌐 โครงสร้างระบบ
1 | Flutter App <--> REST API (PHP/Node.js) <--> MySQL Database |
🛠️ 1. สร้าง REST API ด้วย PHP (ตัวอย่าง)
ไฟล์: get_users.php
1 2 3 4 5 6 7 8 9 | <?php $conn = new mysqli("localhost", "root", "", "flutter_demo"); $result = $conn->query("SELECT id, name, email FROM users"); $data = []; while ($row = $result->fetch_assoc()) { $data[] = $row; } echo json_encode($data); ?> |
📱 2. เรียก API จาก Flutter
เพิ่ม dependency ใน pubspec.yaml
1 2 | dependencies: http: ^0.13.5 |
โค้ด Flutter:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 | import 'package:flutter/material.dart'; import 'package:http/http.dart' as http; import 'dart:convert'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp(home: UserList()); } } class UserList extends StatefulWidget { @override _UserListState createState() => _UserListState(); } class _UserListState extends State<UserList> { List users = []; Future<void> fetchUsers() async { final response = await http.get(Uri.parse('http://yourdomain.com/get_users.php')); if (response.statusCode == 200) { setState(() => users = json.decode(response.body)); } } @override void initState() { super.initState(); fetchUsers(); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: Text('Users from MySQL')), body: ListView.builder( itemCount: users.length, itemBuilder: (ctx, i) => ListTile( title: Text(users[i]['name']), subtitle: Text(users[i]['email']), ), ), ); } } |
✅ สรุป
- Flutter สื่อสารกับ MySQL ผ่าน REST API เท่านั้น
- API ฝั่ง PHP รับผิดชอบ query และส่ง JSON กลับ
- Flutter ใช้
http
package รับข้อมูลมาแสดงผล
หากต้องการต่อยอด: เพิ่ม insert/update, auth, JWT, pagination ฯลฯ ได้เลยครับ!