เริ่มต้นใช้งาน Gemini API โดยใช้ Vertex AI ใน Firebase SDK


คู่มือนี้จะแสดงวิธีเริ่มต้นการเรียกใช้ Vertex AI Gemini API โดยตรงจากแอปโดยใช้ SDK Vertex AI in Firebase สําหรับแพลตฟอร์มที่เลือก

ข้อกำหนดเบื้องต้น

คู่มือนี้จะถือว่าคุณคุ้นเคยกับการใช้ JavaScript ในการพัฒนา เว็บแอป คู่มือนี้ไม่เกี่ยวข้องกับเฟรมเวิร์ก

  • ตรวจสอบว่าสภาพแวดล้อมในการพัฒนาซอฟต์แวร์และเว็บแอปเป็นไปตามข้อกำหนดต่อไปนี้ ข้อกำหนด

    • (ไม่บังคับ) Node.js
    • เว็บเบราว์เซอร์สมัยใหม่
  • (ไม่บังคับ) ดูแอปตัวอย่าง

    ดาวน์โหลดแอปตัวอย่าง

    คุณสามารถลองใช้ SDK ได้อย่างรวดเร็ว ดูการใช้งานที่สมบูรณ์ของกรณีการใช้งานต่างๆ หรือใช้แอปตัวอย่างหากไม่มีเว็บแอปของคุณเอง หากต้องการใช้แอปตัวอย่าง คุณจะต้องเชื่อมต่อแอปกับโปรเจ็กต์ Firebase

ขั้นตอนที่ 1: ตั้งค่าโปรเจ็กต์ Firebase และเชื่อมต่อแอปกับ Firebase

หากคุณมีโปรเจ็กต์ Firebase และแอปที่เชื่อมต่อกับ Firebase อยู่แล้ว

  1. ในคอนโซล Firebase ให้ไปที่ หน้า Build with Gemini

  2. คลิกการ์ด Vertex AI in Firebase เพื่อเปิดใช้งานเวิร์กโฟลว์ที่จะช่วยคุณทำงานต่อไปนี้ (โปรดทราบว่าหากเห็นแท็บในคอนโซลสำหรับ Vertex AI แสดงว่างานเหล่านี้เสร็จสมบูรณ์แล้ว)

  3. ไปยังขั้นตอนถัดไปในคู่มือนี้เพื่อเพิ่ม SDK ลงในแอป

หากคุณยังไม่มีโปรเจ็กต์ Firebase และแอปที่เชื่อมต่อกับ Firebase


ขั้นตอนที่ 2: เพิ่ม SDK

เมื่อตั้งค่าโปรเจ็กต์ Firebase และเชื่อมต่อแอปกับ Firebase แล้ว (ดูขั้นตอนก่อนหน้า) ตอนนี้คุณก็เพิ่ม Vertex AI in Firebase SDK ลงในแอปได้แล้ว

ไลบรารี Vertex AI in Firebase ให้สิทธิ์เข้าถึง Vertex AI Gemini API และรวมอยู่ใน Firebase JavaScript SDK สำหรับเว็บ

  1. ติดตั้ง Firebase JS SDK สําหรับเว็บโดยใช้ npm

    npm install firebase
    
  2. เริ่มต้น Firebase ในแอป

    import { initializeApp } from "firebase/app";
    
    // TODO(developer) Replace the following with your app's Firebase configuration
    // See: https://firebase.google.com/docs/web/learn-more#config-object
    const firebaseConfig = {
      // ...
    };
    
    // Initialize FirebaseApp
    const firebaseApp = initializeApp(firebaseConfig);
    

ขั้นตอนที่ 3: เริ่มต้นบริการ Vertex AI และโมเดล Generative

คุณต้องเริ่มต้นVertex AIบริการและโมเดล Generative ก่อนจึงจะเรียก API ได้

import { initializeApp } from "firebase/app";
import { getVertexAI, getGenerativeModel } from "firebase/vertexai-preview";

// TODO(developer) Replace the following with your app's Firebase configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
};

// Initialize FirebaseApp
const firebaseApp = initializeApp(firebaseConfig);

// Initialize the Vertex AI service
const vertexAI = getVertexAI(firebaseApp);

// Initialize the generative model with a model that supports your use case
// Gemini 1.5 models are versatile and can be used with all API capabilities
const model = getGenerativeModel(vertexAI, { model: "gemini-1.5-flash" });

เมื่ออ่านคู่มือการเริ่มต้นใช้งานจนจบแล้ว ให้ดูวิธีเลือกรุ่น Gemini และ (ไม่บังคับ) ตำแหน่งที่เหมาะสมกับกรณีการใช้งานและแอป

ขั้นตอนที่ 4: โทรหา Vertex AI Gemini API

เมื่อเชื่อมต่อแอปกับ Firebase, เพิ่ม SDK และเริ่มต้นบริการ Vertex AI และ Generative Model แล้ว คุณก็พร้อมเรียกใช้ Vertex AI Gemini API

คุณสามารถใช้ generateContent() เพื่อสร้างข้อความจากพรอมต์แบบข้อความเท่านั้น คำขอ:

import { initializeApp } from "firebase/app";
import { getVertexAI, getGenerativeModel } from "firebase/vertexai-preview";

// TODO(developer) Replace the following with your app's Firebase configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
};

// Initialize FirebaseApp
const firebaseApp = initializeApp(firebaseConfig);

// Initialize the Vertex AI service
const vertexAI = getVertexAI(firebaseApp);

// Initialize the generative model with a model that supports your use case
// Gemini 1.5 models are versatile and can be used with all API capabilities
const model = getGenerativeModel(vertexAI, { model: "gemini-1.5-flash" });

// Wrap in an async function so you can use await
async function run() {
  // Provide a prompt that contains text
  const prompt = "Write a story about a magic backpack."

  // To generate text output, call generateContent with the text input
  const result = await model.generateContent(prompt);

  const response = result.response;
  const text = response.text();
  console.log(text);
}

run();

คุณทำอะไรได้อีกบ้าง

ดูข้อมูลเพิ่มเติมเกี่ยวกับโมเดล Gemini

ดูข้อมูลเกี่ยวกับรูปแบบที่ใช้ได้กับกรณีการใช้งานต่างๆ และโควต้าและราคา

ลองใช้ความสามารถอื่นๆ ของ Gemini API

ดูวิธีควบคุมการสร้างเนื้อหา

คุณยังทดสอบพรอมต์และการกําหนดค่ารูปแบบได้โดยใช้ Vertex AI Studio


แสดงความคิดเห็น เกี่ยวกับประสบการณ์การใช้งาน Vertex AI in Firebase