ตอนนี้ Google AI Studio รองรับการพัฒนาแบบ Full-Stack แล้ว ซึ่งช่วยให้คุณสร้างแอปพลิเคชันที่มากกว่าต้นแบบฝั่งไคลเอ็นต์ได้ เมื่อมีรันไทม์ฝั่งเซิร์ฟเวอร์ คุณจะจัดการข้อมูลลับ เชื่อมต่อกับ API ภายนอก และสร้างประสบการณ์แบบผู้เล่นหลายคนแบบเรียลไทม์ได้
รันไทม์ฝั่งเซิร์ฟเวอร์
ตอนนี้แอปพลิเคชัน Google AI Studio สามารถมีคอมโพเนนต์ฝั่งเซิร์ฟเวอร์ (Node.js) ได้แล้ว ซึ่งจะช่วยให้คุณทำสิ่งต่อไปนี้ได้
- เรียกใช้ตรรกะฝั่งเซิร์ฟเวอร์: เรียกใช้โค้ดที่ไม่ควรเปิดเผยต่อ ไคลเอ็นต์
- เข้าถึงแพ็กเกจ npm: Antigravity Agent สามารถติดตั้งและใช้แพ็กเกจจากระบบนิเวศ npm ขนาดใหญ่ได้
- จัดการข้อมูลลับ: ใช้คีย์ API และข้อมูลเข้าสู่ระบบอย่างปลอดภัย
ใช้แพ็กเกจ npm
คุณไม่จำเป็นต้องเรียกใช้ npm install ด้วยตนเอง เพียงขอให้ Agent เพิ่มฟังก์ชันการทำงานที่ต้องใช้แพ็กเกจ แล้ว Agent จะจัดการการติดตั้งและการนำเข้าให้
ตัวอย่าง: > "ใช้ axios เพื่อดึงข้อมูลจาก API ภายนอก"
จัดการข้อมูลลับอย่างปลอดภัย
เมื่อมีโค้ดฝั่งเซิร์ฟเวอร์และการจัดการข้อมูลลับ ตอนนี้คุณสามารถสร้างแอปที่โต้ตอบกับโลกภายนอกได้แล้ว
- API ของบุคคลที่สาม: เชื่อมต่อกับบริการต่างๆ เช่น Stripe, SendGrid หรือ REST API ที่กำหนดเอง
- ฐานข้อมูล: เชื่อมต่อกับฐานข้อมูลภายนอก (เช่น ผ่าน Supabase, Firebase, หรือ MongoDB Atlas) เพื่อเก็บข้อมูลไว้หลังจากเซสชันสิ้นสุดลง
เมื่อสร้างแอปในโลกแห่งความเป็นจริง คุณมักจะต้องเชื่อมต่อกับบริการของบุคคลที่สาม (เช่น Twilio, Slack หรือฐานข้อมูล) ที่ต้องใช้คีย์ API คุณสามารถเพิ่มคีย์ด้วยตนเองโดยทำตามขั้นตอนต่อไปนี้
- เพิ่มข้อมูลลับ: ไปที่เมนูการตั้งค่า ใน Google AI Studio แล้วมองหา ส่วนข้อมูลลับ
- จัดเก็บคีย์: เพิ่มคีย์ API หรือโทเค็นลับที่นี่
- เข้าถึงในโค้ด: Agent สามารถเขียนโค้ดฝั่งเซิร์ฟเวอร์ที่เข้าถึง ข้อมูลลับเหล่านี้ได้อย่างปลอดภัย (โดยปกติจะผ่านตัวแปรสภาพแวดล้อม) เพื่อให้มั่นใจว่าจะไม่มีการเปิดเผยข้อมูลลับต่อ เบราว์เซอร์ฝั่งไคลเอ็นต์
เมื่อจำเป็น Agent จะแสดงการ์ดในแชทเพื่อแจ้งให้คุณเพิ่มคีย์ทุกครั้งที่ต้องใช้ข้อมูลลับใหม่หรือเมื่อตรวจพบคีย์ใหม่ในตัวแปร env ของโปรเจ็กต์
การผสานรวม Firebase สำหรับฐานข้อมูลและการตรวจสอบสิทธิ์
ตอนนี้ Google AI Studio ช่วยให้คุณเพิ่มฐานข้อมูลหรือการตรวจสอบสิทธิ์ลงใน แอปได้อย่างง่ายดายผ่าน การผสานรวม Firebase Antigravity Agent สามารถจัดเตรียมและตั้งค่าบริการต่อไปนี้ให้คุณโดยอัตโนมัติ
- ฐานข้อมูล Firestore: ฐานข้อมูล NoSQL บนระบบคลาวด์ที่ยืดหยุ่นและปรับขนาดได้เพื่อจัดเก็บ และซิงค์ข้อมูลสำหรับการพัฒนาฝั่งไคลเอ็นต์และฝั่งเซิร์ฟเวอร์
- การตรวจสอบสิทธิ์ Firebase: อนุญาตให้ผู้ใช้ลงชื่อเข้าใช้ แอปพลิเคชันของคุณได้อย่างปลอดภัยโดยใช้โฟลว์ "ลงชื่อเข้าใช้ด้วย Google"
เพียงขอให้ Agent "เพิ่มฐานข้อมูลลงในแอปของฉัน" หรือ "ตั้งค่า Google Sign-in" แล้ว Agent จะจัดการการกำหนดค่าและการสร้างโค้ดที่จำเป็นให้คุณ
Firebase ให้คุณเริ่มต้นใช้งานได้ฟรี และเลือกปรับขนาดด้วยบัญชีแบบชำระเงินได้ทุกเมื่อที่พร้อมจะใช้โควต้าเพิ่มเติมหรือใช้ฟีเจอร์แบบชำระเงิน
ตั้งค่า OAuth
กรณีการใช้งานที่สำคัญอย่างหนึ่งสำหรับการจัดการข้อมูลลับคือการตั้งค่า OAuth เพื่อเชื่อมต่อกับเว็บไซต์หรือแอปอื่นๆ เมื่อพรอมต์มีคำแนะนำเกี่ยวกับการเชื่อมต่อกับแอปของบุคคลที่สามที่ต้องใช้การตรวจสอบสิทธิ์ OAuth Agent จะให้คำแนะนำเกี่ยวกับวิธีตั้งค่า OAuth สำหรับแอปพลิเคชันนั้น คำแนะนำเหล่านี้จะมี URL เรียกกลับที่จำเป็นสำหรับการกำหนดค่าแอปพลิเคชัน OAuth นอกจากนี้ คุณยังดู URL เรียกกลับได้ในส่วนการผสานรวม ในแผงการตั้งค่า
สร้างประสบการณ์แบบผู้เล่นหลายคน
รันไทม์แบบ Full-Stack ช่วยให้ฟีเจอร์การทำงานร่วมกันแบบเรียลไทม์เป็นไปได้
- สถานะแบบเรียลไทม์: คุณสามารถขอให้ Agent สร้างฟีเจอร์ต่างๆ เช่น "แชทสด" "ไวท์บอร์ดสำหรับการทำงานร่วมกัน" หรือ "เกมแบบผู้เล่นหลายคน"
- เซสชันที่ซิงค์แล้ว: เซิร์ฟเวอร์จะจัดการสถานะ ซึ่งช่วยให้ผู้ใช้หลายคน โต้ตอบกับอินสแตนซ์แอปพลิเคชันเดียวกันได้แบบเรียลไทม์
ตัวอย่างพรอมต์: > "สร้างเกมนี้ให้เป็นเกมแบบผู้เล่นหลายคนซึ่งผู้เล่นจะเห็นเคอร์เซอร์ของผู้เล่นคนอื่นๆ ได้"
เคล็ดลับสำหรับการทดสอบแอปแบบผู้เล่นหลายคน
คุณสามารถทดสอบโหมดผู้เล่นหลายคนได้ 2 วิธีก่อนที่จะติดตั้งใช้งานแอป
- เปิดแอปในโหมดสร้างของ Google AI Studio ในหลายแท็บ เมื่อพัฒนาในโหมดสร้าง แอปของคุณจะอยู่ในคอนเทนเนอร์สำหรับนักพัฒนาแอป การเปิดแอปในหลายแท็บจะช่วยให้คุณจำลองผู้เล่นหลายคนที่ใช้แอปได้
- แชร์แอปกับผู้อื่นโดยใช้เมนูแชร์ ที่ด้านขวาบน จากนั้นใช้ URL ที่แชร์ จากแท็บการผสานรวม ของเมนูแชร์ เพื่อใช้แอปกับผู้เล่นที่คุณแชร์แอปด้วย
แนวทางปฏิบัติแนะนำ
- ความปลอดภัยของข้อมูลลับ: ใช้ Secret Manager สำหรับคีย์ที่ละเอียดอ่อนเสมอ และอย่าฮาร์ดโค้ดคีย์เหล่านั้นในไฟล์
- การแยกความกังวล: เก็บตรรกะ UI ไว้ในเฟรมเวิร์กฝั่งไคลเอ็นต์ (React/Angular) และเก็บตรรกะทางธุรกิจ/การจัดการข้อมูลไว้ฝั่งเซิร์ฟเวอร์
- การจัดการข้อผิดพลาด: ตรวจสอบว่าโค้ดฝั่งเซิร์ฟเวอร์จัดการข้อผิดพลาด จากการเรียก API ภายนอกได้อย่างมีประสิทธิภาพเพื่อป้องกันไม่ให้แอปขัดข้อง