البدء باستخدام Gemini API باستخدام Vertex AI في حِزم تطوير البرامج (SDK) لمنصة Firebase


يوضِّح لك هذا الدليل كيفية البدء في إجراء مكالمات على Vertex AI Gemini API من تطبيقك مباشرةً باستخدام حزمة تطوير البرامج (SDK) Vertex AI in Firebase للنظام الأساسي الذي اخترته

المتطلبات الأساسية

يفترض هذا الدليل أنّك على دراية باستخدام JavaScript لتطوير وتطبيقات الويب. لا يرتبط هذا الدليل بإطار العمل.

  • عليك التأكّد من أنّ بيئة التطوير وتطبيق الويب يستوفيان ما يلي: المتطلبات:

    • (اختياري) Node.js
    • متصفح ويب حديث

  • (اختياري) يمكنك الاطّلاع على نموذج التطبيق.

    تنزيل نموذج التطبيق

    يمكنك تجربة SDK بسرعة، ومعرفة التنفيذ الكامل لمختلف الاستخدامات الحالات، أو استخدام نموذج التطبيق إذا لم يكن لديك تطبيق الويب الخاص بك. لاستخدام نموذج التطبيق، ستحتاج إلى ربطه بمشروع على Firebase

الخطوة 1: إعداد مشروع على Firebase وربط تطبيقك بمنصّة Firebase

إذا كان لديك مشروع على Firebase وتطبيق مرتبط بمنصّة Firebase

  1. في وحدة تحكّم Firebase، انتقِل إلى صفحة الإنشاء باستخدام Gemini:

  2. انقر على البطاقة Vertex AI in Firebase لبدء سير عمل يساعدك لإكمال المهام التالية. (لاحظ أنه إذا رأيت علامة تبويب في وحدة التحكم Vertex AI، وتكون هذه المهام مكتملة.)

  3. يمكنك المتابعة إلى الخطوة التالية في هذا الدليل لإضافة حزمة تطوير البرامج (SDK) إلى تطبيقك.

إذا لم يكن لديك مشروع على Firebase وتطبيق مرتبط بمنصّة Firebase


الخطوة 2: إضافة حزمة SDK

بعد إعداد مشروع Firebase وربط تطبيقك بمنصّة Firebase (يُرجى الاطّلاع على الخطوة السابقة)، يمكنك الآن إضافة حزمة تطوير البرامج (SDK) لنظام التشغيل Vertex AI in Firebase إلى تطبيقك.

توفّر مكتبة Vertex AI in Firebase إمكانية الوصول إلى Vertex AI Gemini API ويتم تضمينها كجزء من حزمة تطوير البرامج (SDK) لJavaScript لمنصة Firebase على الويب

  1. تثبيت حزمة تطوير البرامج (SDK) لـ Firebase JS للويب باستخدام 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 والنموذج التوليدي

لتتمكّن من إجراء أي طلبات بيانات من واجهة برمجة التطبيقات، عليك إعداد Vertex AI. والخدمة والنموذج التوليدي.

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 والنموذج التوليدي، أصبحت جاهزًا للاتصال بـ 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"