Flutter ChatGPT Part 1 สอน

redev rx
2 min readMay 12, 2023

--

Flutter Chat-GPT

Flutter ChatGPT PART 1
Flutter ChatGPT PART 2
Flutter ChatGPT PART 3

Table Of Content
มารู้จักกับ ChatGPT
Flutter ChatGPT-SDK Lib
ChatGPT Token Key
Hello Prompt

มารู้จักกับ ChatGPT

ChatGPT เป็นโมเดลที่ถูกสร้างขึ้นโดย OpenAI เพื่อใช้ในการสร้างบทสนทนาและการสื่อสารกับผู้ใช้งาน โมเดลนี้ถูกฝึกสอนด้วยข้อมูลจำนวนมากเพื่อเรียนรู้และเข้าใจรูปแบบและโครงสร้างของภาษาซึ่งทำให้มีความสามารถในการตอบคำถามและให้ข้อมูลต่างๆ อย่างคล้ายคลึงกับการสนทนากับมนุษย์

ChatGPT

Flutter ChatGPT-SDK Lib

การใช้งาน ChatGPT ใน Flutter สามารถทำได้หลายรูปแบบ เช่นการทำ API แต่ในบทความนี้เราจะมาใช้เจ้าตัว Library ที่มีชื่อว่า chat_gpt_sdk กันโดยตัว lib นี้มี Features เยอะมากไม่ว่าจะเป็น Generate Prompt , Gen Image หรืออื่น ๆ สามารถดูได้ที่ chat_gpt_sdk | Flutter Package (pub.dev)

Flutter ChatGPT SDK

ทำการ install package ที่ไฟล์ pubspec.yml ดังรูป

Install Package

ChatGPT Token Key

Token เป็นอีกหนึ่งอย่าง ที่เราต้องเตรียมเมื่อจะเข้าใช้งาน Open API โดยเราสามารถเข้าไปที่ OpenAI API โดยไปที่ Menu ดังภาพแล้วกดรับ Token มาได้เลย

get Token

Hello Prompt

ตัวอย่างนี้เราจะทำการส่งคำว่า Hello ไปที่ ChatCompletion กัน Let go …

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

@override
State<ChatCompletionExample> createState() => _ChatCompletionExampleState();
}

class _ChatCompletionExampleState extends State<ChatCompletionExample> {
///[openAI]
late OpenAI openAI;

@override
void initState() {
///new instance ให้กับ openAI
///และทำกับใส่ Token ที่ไป copy มาก่อนหน้านี้
///พร้อมกับหนด timeout
openAI = OpenAI.instance.build(
token: "your-access-token",
baseOption: HttpSetup(receiveTimeout: const Duration(seconds: 18)),
isLog: true);
super.initState();
}

///[example]
///send Hello to ChatCompletion
void example() async {
///request ใส่ prompt ตามใจ ตัวอย่างใส่ Hello!
final request = ChatCompleteText(model: ChatModel.gptTurbo, messages: [
Map.of({"role": "user", "content": 'Hello!'})
]);

///call api ไปที่ onChatCompletion
final it = await openAI.onChatCompletion(request: request);
debugPrint('${it?.choices.last.message?.content}');
}

@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: CupertinoButton(
onPressed: () => example(), child: const Text("Click")),
),
);
}
}
ผลลัพธ์

enjoy!

--

--