การแจ้งเตือน AI แบบผสมด้วยตรรกะ AI ของ Firebase

Thomas Steiner

เผยแพร่: 20 พฤษภาคม 2025

หากต้องการตอบสนองความต้องการของผู้ใช้ ไม่ว่าผู้ใช้จะใช้แพลตฟอร์มหรือฮาร์ดแวร์ใด คุณสามารถตั้งค่า การสำรองข้อมูลไปยังระบบคลาวด์ด้วย Firebase AI Logic สำหรับ Prompt API ในตัว

สร้างประสบการณ์การใช้งาน AI แบบไฮบริด

AI ในตัวมาพร้อมสิทธิประโยชน์มากมาย โดยเฉพาะอย่างยิ่ง

  • การประมวลผลข้อมูลที่ละเอียดอ่อนในพื้นที่: หากทำงานกับข้อมูลที่ละเอียดอ่อน คุณสามารถเสนอฟีเจอร์ AI ให้แก่ผู้ใช้ที่มีการเข้ารหัสจากต้นทางถึงปลายทางได้
  • การใช้งาน AI แบบออฟไลน์: ผู้ใช้จะเข้าถึงฟีเจอร์ AI ได้แม้ในขณะที่ออฟไลน์หรือการเชื่อมต่อขาดหายไป

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

เริ่มต้นใช้งาน Firebase

  1. สร้างโปรเจ็กต์ Firebase และลงทะเบียนเว็บแอปพลิเคชัน
  2. อ่านเอกสารประกอบของ Firebase JavaScript SDK เพื่อตั้งค่าเว็บแอปพลิเคชันต่อไป

โปรเจ็กต์ Firebase จะสร้างโปรเจ็กต์ Google Cloud ที่มีการกำหนดค่าและบริการเฉพาะของ Firebase ดูข้อมูลเพิ่มเติมเกี่ยวกับ Google Cloud และ Firebase

ติดตั้ง SDK

เวิร์กโฟลว์นี้ใช้ npm และต้องใช้เครื่องมือ Bundler ของโมดูลหรือเฟรมเวิร์ก JavaScript Firebase AI Logic ได้รับการเพิ่มประสิทธิภาพให้ทำงานร่วมกับเครื่องมือจัดกลุ่มโมดูลเพื่อ กำจัดโค้ดที่ไม่ได้ใช้และลดขนาด SDK

npm install firebase

เมื่อติดตั้งแล้ว ให้เริ่มต้นใช้งาน Firebase ในแอปพลิเคชัน

ใช้ Firebase AI Logic

เมื่อติดตั้งและเริ่มต้น Firebase แล้ว ให้เลือก Gemini Developer API หรือ Gemini API จากนั้นเริ่มต้นและสร้างอินสแตนซ์

เมื่อเริ่มต้นแล้ว คุณสามารถป้อนข้อความหรืออินพุตแบบมัลติโมดัลเพื่อแจ้งโมเดลได้

พรอมต์ข้อความ

คุณใช้ข้อความธรรมดาสำหรับคำสั่งที่ส่งไปยังโมเดลได้ เช่น คุณ อาจขอให้โมเดลเล่าเรื่องตลกให้ฟัง

คุณมีตัวเลือกในการกำหนดเส้นทางคำขอ ดังนี้

  • ใช้ AI ในตัวโดยค่าเริ่มต้นเมื่อพร้อมใช้งานโดยตั้งค่า mode เป็น 'prefer_on_device' ในฟังก์ชัน getGenerativeModel() หากโมเดลในตัว ไม่พร้อมใช้งาน คำขอจะเปลี่ยนไปใช้โมเดลระบบคลาวด์ โดยอัตโนมัติ (หากคุณออนไลน์อยู่)

  • ใช้โมเดลระบบคลาวด์โดยค่าเริ่มต้นเมื่อคุณออนไลน์โดยตั้งค่า mode เป็น 'prefer_in_cloud' ในฟังก์ชัน getGenerativeModel() หากคุณออฟไลน์ คำขอจะเปลี่ยนไปใช้ AI ในตัวอย่างราบรื่นเมื่อพร้อมใช้งาน 

// Initialize the Google AI service.
const googleAI = getAI(firebaseApp);

// Create a `GenerativeModel` instance with a model that supports your use case.
const model = getGenerativeModel(googleAI, { mode: 'prefer_on_device' });

const prompt = 'Tell me a joke';

const result = await model.generateContentStream(prompt);

for await (const chunk of result.stream) {
  const chunkText = chunk.text();
  console.log(chunkText);
}
console.log('Complete response', await result.response);

พรอมต์แบบหลายรูปแบบ

นอกจากนี้ คุณยังป้อนพรอมต์ด้วยรูปภาพหรือเสียงได้ด้วย คุณสามารถบอกโมเดลให้บรรยายเนื้อหาของรูปภาพหรือถอดเสียงไฟล์เสียงได้

ต้องส่งรูปภาพเป็นสตริงที่เข้ารหัส Base64 เป็นออบเจ็กต์ FileDataPart ของ Firebase ซึ่งทำได้ด้วยฟังก์ชันตัวช่วย fileToGenerativePart()

// Converts a File object to a `FileDataPart` object.
// https://firebase.google.com/docs/reference/js/vertexai.filedatapart
async function fileToGenerativePart(file) {
    const base64EncodedDataPromise = new Promise((resolve) => {
      const reader = new FileReader();
      reader.onload = () => resolve(reader.result.split(',')[1]);
      reader.readAsDataURL(file);
    });

    return {
      inlineData: { data: await base64EncodedDataPromise, mimeType: file.type },
    };
  }

  const fileInputEl = document.querySelector('input[type=file]');

  fileInputEl.addEventListener('change', async () => {
    const prompt = 'Describe the contents of this image.';

    const imagePart = await fileToGenerativePart(fileInputEl.files[0]);

    // To generate text output, call generateContent with the text and image
    const result = await model.generateContentStream([prompt, imagePart]);

    for await (const chunk of result.stream) {
      const chunkText = chunk.text();
      console.log(chunkText);
    }
    console.log(Complete response: ', await result.response);
  });

สาธิต

ไปที่เดโม Firebase AI Logic ในอุปกรณ์และเบราว์เซอร์ต่างๆ คุณจะเห็นว่าคำตอบของโมเดลมาจากโมเดล AI ในตัวหรือคลาวด์

เมื่อใช้ฮาร์ดแวร์ที่รองรับใน Chrome การสาธิตจะใช้ Prompt API และ Gemini Nano โดยจะมีการส่งคำขอเพียง 3 รายการสำหรับเอกสารหลัก ไฟล์ JavaScript และไฟล์ CSS

ตรรกะ AI ของ Firebase ที่ทำงานใน Chrome โดยใช้ AI API ในตัว

เมื่ออยู่ในเบราว์เซอร์อื่นหรือระบบปฏิบัติการที่ไม่มีการรองรับ AI ในตัว ระบบจะส่งคำขอเพิ่มเติมไปยังปลายทาง Firebase https://firebasevertexai.googleapis.com

ตรรกะ AI ของ Firebase ที่ทำงานใน Safari ซึ่งส่งคำขอไปยังเซิร์ฟเวอร์ Firebase

เข้าร่วมและแชร์ความคิดเห็น

Firebase AI Logic เป็นตัวเลือกที่ยอดเยี่ยมในการผสานรวมความสามารถของ AI เข้ากับเว็บแอป การให้การทำงานสำรองไปยังระบบคลาวด์เมื่อ Prompt API ไม่พร้อมใช้งาน SDK จะช่วยให้มั่นใจได้ว่าฟีเจอร์ AI จะเข้าถึงได้ในวงกว้างและมีความน่าเชื่อถือมากขึ้น

โปรดทราบว่าแอปพลิเคชันระบบคลาวด์สร้างความคาดหวังใหม่ๆ เกี่ยวกับความเป็นส่วนตัวและ ฟังก์ชันการทํางาน ดังนั้นจึงควรแจ้งให้ผู้ใช้ทราบว่าระบบประมวลผลข้อมูลของผู้ใช้ที่ใด