অন-ডিভাইস এবং ক্লাউড-হোস্টেড মডেলগুলির সাহায্যে ওয়েব অ্যাপগুলিতে হাইব্রিড অভিজ্ঞতা তৈরি করুন

Firebase AI Logic ব্যবহার করে হাইব্রিড ইনফারেন্সের মাধ্যমে এআই-চালিত ওয়েব অ্যাপ এবং ফিচার তৈরি করুন। হাইব্রিড ইনফারেন্সের সাহায্যে, ডিভাইসে উপলব্ধ মডেল ব্যবহার করে ইনফারেন্স চালানো যায় এবং অন্যথায় এটি নির্বিঘ্নে ক্লাউড-হোস্টেড মডেলে ফিরে যেতে পারে (এবং এর বিপরীতটিও সম্ভব)।

এই পৃষ্ঠায় ক্লায়েন্ট SDK ব্যবহার শুরু করার পদ্ধতি বর্ণনা করা হয়েছে। এই সাধারণ সেটআপটি সম্পন্ন করার পর, অতিরিক্ত কনফিগারেশন বিকল্প এবং সক্ষমতাগুলো (যেমন স্ট্রাকচার্ড আউটপুট) দেখে নিন।

উল্লেখ্য যে, ডেস্কটপে ক্রোমে চালিত ওয়েব অ্যাপগুলোর জন্য অন-ডিভাইস ইনফারেন্স সমর্থিত।

কোডের উদাহরণগুলিতে যান

সুপারিশকৃত ব্যবহারের ক্ষেত্র এবং সমর্থিত সক্ষমতা

সুপারিশকৃত ব্যবহারের ক্ষেত্রসমূহ:

  • ইনফারেন্সের জন্য অন-ডিভাইস মডেল ব্যবহারের সুবিধাগুলো হলো:

    • উন্নত গোপনীয়তা
    • স্থানীয় প্রেক্ষাপট
    • বিনা খরচে অনুমান
    • অফলাইন কার্যকারিতা
  • হাইব্রিড কার্যকারিতা ব্যবহারের সুবিধা:

    • ডিভাইসে মডেলের প্রাপ্যতা বা ইন্টারনেট সংযোগ নির্বিশেষে আপনার শতভাগ দর্শকের কাছে পৌঁছান।

অন-ডিভাইস ইনফারেন্সের জন্য সমর্থিত সক্ষমতা এবং বৈশিষ্ট্যসমূহ:

অন-ডিভাইস ইনফারেন্স শুধুমাত্র একক-টার্ন টেক্সট জেনারেশন (চ্যাট নয় ) সমর্থন করে, যার আউটপুট স্ট্রিমিং বা নন-স্ট্রিমিং হতে পারে। এটি নিম্নলিখিত টেক্সট-জেনারেটর ক্ষমতাগুলো সমর্থন করে:

আপনি JSON এবং enum সহ কাঠামোগত আউটপুটও তৈরি করতে পারেন।

শুরু করার আগে

নিম্নলিখিত বিষয়গুলো লক্ষ্য করুন:

লোকালহোস্টে শুরু করুন

এই প্রারম্ভিক ধাপগুলোতে আপনার পাঠাতে চাওয়া যেকোনো সমর্থিত প্রম্পট অনুরোধের জন্য প্রয়োজনীয় সাধারণ সেটআপ বর্ণনা করা হয়েছে।

ধাপ ১ : ডিভাইসে ইনফারেন্সের জন্য ক্রোম এবং প্রম্পট এপিআই সেট আপ করুন।

  1. নিশ্চিত করুন যে আপনি ক্রোমের সাম্প্রতিক সংস্করণ ব্যবহার করছেন। chrome://settings/help থেকে আপডেট করুন।
    ক্রোম সংস্করণ ১৩৯ এবং তার পরবর্তী সংস্করণগুলো থেকে ডিভাইসেই ইনফারেন্স সুবিধাটি পাওয়া যায়।

  2. নিম্নলিখিত ফ্ল্যাগটিকে 'Enabled'- এ সেট করে অন-ডিভাইস মাল্টিমোডাল মডেলটি সক্রিয় করুন:

    • chrome://flags/#prompt-api-for-gemini-nano-multimodal-input
  3. ক্রোম পুনরায় চালু করুন।

  4. (ঐচ্ছিক) প্রথম অনুরোধের আগে ডিভাইসে থাকা মডেলটি ডাউনলোড করুন।

    প্রম্পট এপিআই ক্রোমের সাথে বিল্ট-ইন থাকে; তবে, অন-ডিভাইস মডেলটি ডিফল্টভাবে উপলব্ধ নয়। আপনি যদি অন-ডিভাইস ইনফারেন্সের জন্য আপনার প্রথম অনুরোধের আগে মডেলটি ডাউনলোড না করে থাকেন, তাহলে অনুরোধটি স্বয়ংক্রিয়ভাবে ব্যাকগ্রাউন্ডে মডেল ডাউনলোড শুরু করে দেবে।

ধাপ ২ : একটি ফায়ারবেস প্রজেক্ট সেট আপ করুন এবং আপনার অ্যাপটিকে ফায়ারবেসের সাথে সংযুক্ত করুন।

  1. Firebase কনসোলে সাইন ইন করুন এবং তারপরে আপনার ফায়ারবেস প্রজেক্টটি নির্বাচন করুন।

  2. Firebase কনসোলে, AI Services > AI Logic- এ যান।

  3. আপনার প্রোজেক্টের জন্য প্রয়োজনীয় এপিআই ও রিসোর্স সেট আপ করতে সাহায্যকারী একটি নির্দেশিত ওয়ার্কফ্লো চালু করতে 'Get started'- এ ক্লিক করুন।

  4. অনুরোধ করা হলে, আপনার অ্যাপটি নিবন্ধন করতে এবং আপনার অ্যাপে Firebase কনফিগারেশন যোগ করতে স্ক্রিনে দেওয়া নির্দেশাবলী অনুসরণ করুন।

  5. 'জেমিনি এপিআই প্রোভাইডার' বেছে নিতে বলা হলে, আমরা জেমিনি ডেভেলপার এপিআই নির্বাচন করার পরামর্শ দিই, যা আপনাকে কোনো খরচ ছাড়াই দ্রুত কাজ শুরু করতে দেয়।

    পরবর্তীতে যেকোনো সময়ে, আপনি Vertex AI Gemini API (এবং এর বিলিংয়ের জন্য প্রয়োজনীয় শর্তাবলী) সেট আপ করতে পারেন।

  6. Firebase AI Logic- এর জন্য প্রয়োজনীয় API এবং সংশ্লিষ্ট সার্ভিসগুলো সেট আপ করতে ওয়ার্কফ্লোটি অনুসরণ করে এগিয়ে যান।

    ২০২৬ সালের জুলাই মাসের শুরু থেকে, ওয়ার্কফ্লো-এর এই পর্যায়টি স্বয়ংক্রিয়ভাবে AI Logic- এর জন্য Firebase App Check প্রয়োগ করবে , যা আপনার অ্যাপ থেকে সরাসরি অ্যাক্সেস করার সময় Gemini API-কে সুরক্ষিত রাখতে সাহায্যকারী একটি গুরুত্বপূর্ণ পরিষেবা। শুরু করার অংশ হিসেবে (এই গাইডের পরবর্তী ধাপগুলো দেখুন), App Check প্রয়োগ করা হলে আপনাকে লোকাল ডেভেলপমেন্টের জন্য App Check ডিবাগ প্রোভাইডারটি কনফিগার করতে হবে।

  7. আপনার অ্যাপে প্রয়োজনীয় SDK-গুলো যোগ করতে এই নির্দেশিকার পরবর্তী ধাপে যান।

ধাপ ৩ : SDK যোগ করুন

ফায়ারবেস লাইব্রেরিটি জেনারেটিভ মডেলের সাথে ইন্টারঅ্যাক্ট করার জন্য এপিআই-গুলোতে অ্যাক্সেস প্রদান করে। লাইব্রেরিটি ওয়েবের জন্য ফায়ারবেস জাভাস্ক্রিপ্ট এসডিকে-র অংশ হিসেবে অন্তর্ভুক্ত রয়েছে।

  1. npm ব্যবহার করে Firebase JS SDK for Web ইনস্টল করুন:

    npm install firebase
    
  2. আপনার অ্যাপে Firebase চালু করুন:

    import { initializeApp } from "firebase/app";
    import { initializeAppCheck, DebugProvider } from "firebase/app-check";
    
    // 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);
    

ধাপ ৩ : স্থানীয় ডেভেলপমেন্টের জন্য App Check ডিবাগ প্রোভাইডার কনফিগার করুন

২০২৬ সালের জুলাই মাসের শুরু থেকে, কনসোলে AI Logic- এর জন্য নির্দেশিত সেটআপ ওয়ার্কফ্লো-এর অংশ হিসেবে, Gemini API-কে সুরক্ষিত রাখতে Firebase App Check স্বয়ংক্রিয়ভাবে প্রয়োগ করা হবে। স্থানীয় ডেভেলপমেন্টের জন্য, App Check এর প্রয়োগ বজায় রেখেও অ্যাটেস্টেশন বাইপাস করতে আপনাকে App Check ডিবাগ প্রোভাইডার কনফিগার করতে হবে।

localhost থেকে আপনার অ্যাপটি ইন্টারেক্টিভভাবে চালানোর সময় (উদাহরণস্বরূপ, লোকাল ডেভেলপমেন্টের সময়) ডিবাগ প্রোভাইডারটি কীভাবে ব্যবহার করবেন, তা এখানে দেওয়া হলো:

  1. আপনার ডিবাগ বিল্ডে, App Check ইনিশিয়ালাইজ করার আগে self.FIREBASE_APPCHECK_DEBUG_TOKEN true সেট করে ডিবাগ মোড চালু করুন। উদাহরণস্বরূপ:

    self.FIREBASE_APPCHECK_DEBUG_TOKEN = true;
    initializeAppCheck(app, { /* App Check options */ });
    
  2. আপনার ওয়েব অ্যাপটি স্থানীয়ভাবে খুলুন এবং ব্রাউজারের ডেভেলপার টুলস খুলুন। ডিবাগ কনসোলে, আপনি একটি ডিবাগ টোকেন দেখতে পাবেন:

    AppCheck debug token: "123a4567-b89c-12d3-e456-789012345678".
    You will need to safelist it in the Firebase console for it to work.
    
  3. App Check সাথে আপনার ডিবাগ টোকেন নিবন্ধন করুন:

    1. Firebase কনসোলে, Security > App Check > Apps ট্যাবে যান।

    2. আপনার অ্যাপটি খুঁজুন, ওভারফ্লো মেনুতে ( ) ক্লিক করুন এবং তারপরে 'Manage debug tokens' নির্বাচন করুন।

    3. আপনার ডিবাগ টোকেন নিবন্ধন করতে স্ক্রিনে দেওয়া নির্দেশাবলী অনুসরণ করুন।

ডিবাগ প্রোভাইডার সম্পর্কে বিস্তারিত জানতে (নতুন ডিবাগ টোকেন কীভাবে পাবেন তা সহ), App Check অফিসিয়াল ডকুমেন্টেশন দেখুন।

ধাপ ৪ : পরিষেবাটি চালু করুন এবং একটি মডেল ইনস্ট্যান্স তৈরি করুন।

এই পৃষ্ঠায় প্রদানকারী-নির্দিষ্ট বিষয়বস্তু এবং কোড দেখতে আপনার জেমিনি এপিআই প্রদানকারীর উপর ক্লিক করুন।

মডেলে প্রম্পট অনুরোধ পাঠানোর আগে নিম্নলিখিত বিষয়গুলো সেট আপ করুন:

  1. আপনার নির্বাচিত এপিআই প্রোভাইডারের জন্য সার্ভিসটি চালু করুন।

  2. একটি GenerativeModel ইনস্ট্যান্স তৈরি করুন। mode নিম্নলিখিতগুলির মধ্যে একটিতে সেট করতে ভুলবেন না:

    • PREFER_ON_DEVICE : ডিভাইসে-ভিত্তিক মডেলটি উপলব্ধ থাকলে সেটি ব্যবহার করুন; অন্যথায়, ক্লাউড-হোস্টেড মডেলে ফিরে যান

    • ONLY_ON_DEVICE : ডিভাইসে থাকা মডেলটি উপলব্ধ থাকলে সেটি ব্যবহার করুন; অন্যথায়, একটি ব্যতিক্রম (exception) দেখান

    • PREFER_IN_CLOUD : ক্লাউড-হোস্টেড মডেল উপলব্ধ থাকলে সেটি ব্যবহার করুন; অন্যথায়, অন-ডিভাইস মডেলে ফিরে যান

    • ONLY_IN_CLOUD : ক্লাউড-হোস্টেড মডেলটি উপলব্ধ থাকলে সেটি ব্যবহার করুন; অন্যথায়, একটি এক্সেপশন থ্রো করুন

import { initializeApp } from "firebase/app";
import { getAI, getGenerativeModel, GoogleAIBackend, InferenceMode } from "firebase/ai";

// 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 Gemini Developer API backend service
const ai = getAI(firebaseApp, { backend: new GoogleAIBackend() });

// Create a `GenerativeModel` instance
// Set the mode (for example, use the on-device model if it's available)
const model = getGenerativeModel(ai, { mode: InferenceMode.PREFER_ON_DEVICE });

ধাপ ৫ : ডিভাইসের মডেলটি প্রারম্ভিকীকরণ করুন

ব্যবহারকারীর পেজ ইন্টারঅ্যাকশনের (যেমন বাটনে ক্লিক) পরে বা সেই সময়ে এবং মডেলে প্রম্পট রিকোয়েস্ট পাঠানোর আগে আপনাকে অবশ্যই initializeDeviceModel() কল করতে হবে। ব্যবহারকারী অ্যাক্টিভেশনের এই আবশ্যকতা সম্পর্কে আরও জানতে Chrome ডকুমেন্টেশন দেখুন।

import { initializeApp } from "firebase/app";
import { getAI, getGenerativeModel, GoogleAIBackend, InferenceMode } from "firebase/ai";

// 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 Gemini Developer API backend service
const ai = getAI(firebaseApp, { backend: new GoogleAIBackend() });

// Create a `GenerativeModel` instance
// Set the mode (for example, use the on-device model if it's available)
const model = getGenerativeModel(ai, { mode: InferenceMode.PREFER_ON_DEVICE });

// `initializeDeviceModel` must be called:
// (1) after or on an end-user page interaction such as a button click
// and
// (2) before any queries to the model (such as `generateContent()`)
// You may want to `await` this promise if using `ONLY_ON_DEVICE` (see note below).
model.initializeDeviceModel((val) =>
  // Example: "Download progress: 72.62%""
  console.log(`Download progress: ${Math.round(val*10000) / 100}%`)
);

ধাপ ৬ : একজন মডেলকে একটি প্রম্পট অনুরোধ পাঠান

এই বিভাগে দেখানো হয়েছে কীভাবে বিভিন্ন ধরণের ইনপুট পাঠিয়ে বিভিন্ন ধরণের আউটপুট তৈরি করা যায়, যার মধ্যে রয়েছে:

আপনি যদি কাঠামোগত আউটপুট (যেমন JSON বা enum) তৈরি করতে চান, তাহলে নিম্নলিখিত 'টেক্সট তৈরি করুন' উদাহরণগুলির মধ্যে একটি ব্যবহার করুন এবং এর পাশাপাশি প্রদত্ত স্কিমা অনুযায়ী সাড়া দেওয়ার জন্য মডেলটিকে কনফিগার করুন

শুধুমাত্র টেক্সট ইনপুট থেকে টেক্সট তৈরি করুন

এই নমুনাটি চেষ্টা করার আগে, নিশ্চিত করুন যে আপনি এই নির্দেশিকার ' শুরু করুন' অংশটি সম্পূর্ণ করেছেন।

আপনি generateContent() ব্যবহার করে টেক্সট ধারণকারী কোনো প্রম্পট থেকে টেক্সট তৈরি করতে পারেন:

// Imports + initialization of FirebaseApp and backend service + creation of model instance

// 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();

উল্লেখ্য যে, Firebase AI Logic generateContentStream ব্যবহার করে টেক্সট রেসপন্স স্ট্রিমিং করাও সমর্থন করে ( generateContent এর পরিবর্তে)।

টেক্সট ও ছবি (মাল্টিমোডাল) ইনপুট থেকে টেক্সট তৈরি করুন

এই নমুনাটি চেষ্টা করার আগে, নিশ্চিত করুন যে আপনি এই নির্দেশিকার ' শুরু করুন' অংশটি সম্পূর্ণ করেছেন।

আপনি generateContent() ব্যবহার করে এমন একটি প্রম্পট থেকে টেক্সট তৈরি করতে পারেন, যেখানে টেক্সট এবং ইমেজ ফাইল রয়েছে—এর জন্য প্রতিটি ইনপুট ফাইলের mimeType এবং ফাইলটি নিজেই প্রদান করতে হবে।

ডিভাইসে ইনফারেন্সের জন্য সমর্থিত ইনপুট ছবির ধরণগুলো হলো PNG এবং JPEG।

// Imports + initialization of FirebaseApp and backend service + creation of model instance

// Converts a File object to a Part object.
async function fileToGenerativePart(file) {
  const base64EncodedDataPromise = new Promise((resolve) => {
    const reader = new FileReader();
    reader.onloadend = () => resolve(reader.result.split(',')[1]);
    reader.readAsDataURL(file);
  });
  return {
    inlineData: { data: await base64EncodedDataPromise, mimeType: file.type },
  };
}

async function run() {
  // Provide a text prompt to include with the image
  const prompt = "Write a poem about this picture:";

  const fileInputEl = document.querySelector("input[type=file]");
  const imagePart = await fileToGenerativePart(fileInputEl.files[0]);

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

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

run();

উল্লেখ্য যে, Firebase AI Logic generateContentStream ব্যবহার করে টেক্সট রেসপন্স স্ট্রিমিং করাও সমর্থন করে ( generateContent এর পরিবর্তে)।

ব্যবহারকারীদের আপনার ফিচারটি পরখ করে দেখার সুযোগ দিন।

আপনার অ্যাপে ব্যবহারকারীরা যাতে আপনার ফিচারটি ব্যবহার করে দেখতে পারেন, তার জন্য আপনাকে অবশ্যই Chrome Origin Trials-এ নথিভুক্ত হতে হবে। মনে রাখবেন, এই ট্রায়ালগুলোর একটি সীমিত সময়কাল এবং ব্যবহারের সীমা রয়েছে।

  1. Prompt API Chrome Origin Trial-এর জন্য নিবন্ধন করুন। আপনাকে একটি টোকেন দেওয়া হবে।

  2. যেসব ওয়েব পেজে আপনি ট্রায়াল ফিচারটি চালু করতে চান, সেগুলোর প্রতিটিতে টোকেনটি প্রদান করুন। নিম্নলিখিত বিকল্পগুলির মধ্যে একটি ব্যবহার করুন:

    • <head> ট্যাগের মধ্যে টোকেনটি একটি মেটা ট্যাগ হিসেবে প্রদান করুন: <meta http-equiv="origin-trial" content=" TOKEN ">

    • টোকেনটি একটি HTTP হেডার হিসেবে প্রদান করুন: Origin-Trial: TOKEN

    • প্রোগ্রামের মাধ্যমে টোকেনটি প্রদান করুন।

তুমি আর কী করতে পারো?

আপনার হাইব্রিড অভিজ্ঞতার জন্য আপনি বিভিন্ন অতিরিক্ত কনফিগারেশন বিকল্প এবং সক্ষমতা ব্যবহার করতে পারেন:

ডিভাইসে ইনফারেন্সের জন্য বৈশিষ্ট্যগুলি এখনও উপলব্ধ নয়

একটি প্রিভিউ রিলিজ হওয়ায়, ওয়েব এসডিকে-এর সমস্ত সক্ষমতা অন-ডিভাইস ইনফারেন্সের জন্য উপলব্ধ নয়। নিম্নলিখিত ফিচারগুলো এখনও অন-ডিভাইস ইনফারেন্সের জন্য সমর্থিত নয় (কিন্তু এগুলো সাধারণত ক্লাউড-ভিত্তিক ইনফারেন্সের জন্য উপলব্ধ থাকে)।

  • JPEG এবং PNG ব্যতীত অন্যান্য ইমেজ ফাইল ইনপুট টাইপ থেকে টেক্সট তৈরি করা

    • ক্লাউড-হোস্টেড মডেলে ফিরে যাওয়া যেতে পারে; তবে, ONLY_ON_DEVICE মোড একটি ত্রুটি দেখাবে।
  • অডিও, ভিডিও এবং ডকুমেন্ট (যেমন পিডিএফ) ইনপুট থেকে টেক্সট তৈরি করা

    • ক্লাউড-হোস্টেড মডেলে ফিরে যাওয়া যেতে পারে; তবে, ONLY_ON_DEVICE মোড একটি ত্রুটি দেখাবে।
  • জেমিনি বা ইমাজেন মডেল ব্যবহার করে ছবি তৈরি করা

    • ক্লাউড-হোস্টেড মডেলে ফিরে যাওয়া যেতে পারে; তবে, ONLY_ON_DEVICE মোড একটি ত্রুটি দেখাবে।
  • মাল্টিমোডাল অনুরোধে ইউআরএল ব্যবহার করে ফাইল সরবরাহ করা। আপনাকে অবশ্যই অন-ডিভাইস মডেলগুলিতে ফাইলগুলি ইনলাইন ডেটা হিসাবে সরবরাহ করতে হবে।

  • মাল্টি-টার্ন চ্যাট

    • ক্লাউড-হোস্টেড মডেলে ফিরে যাওয়া যেতে পারে; তবে, ONLY_ON_DEVICE মোড একটি ত্রুটি দেখাবে।
  • Gemini Live API -এর মাধ্যমে দ্বিমুখী স্ট্রিমিং

  • মডেলটিকে তার প্রতিক্রিয়া তৈরি করতে সাহায্য করার জন্য বিভিন্ন টুল সরবরাহ করা (যেমন ফাংশন কলিং, কোড এক্সিকিউশন, ইউআরএল কনটেক্সট, Google Search সাথে গ্রাউন্ডিং, এবং Google Maps সাথে গ্রাউন্ডিং)।

  • টোকেন গণনা করুন

    • সর্বদা একটি ত্রুটি দেখায়। ক্লাউড-হোস্টেড এবং অন-ডিভাইস মডেলের মধ্যে সংখ্যাটি ভিন্ন হবে, তাই এর কোনো সহজ বিকল্প ব্যবস্থা নেই।
  • অন-ডিভাইস ইনফারেন্সের জন্য Firebase কনসোলে এআই মনিটরিং।

    • উল্লেখ্য যে, ক্লাউড-হোস্টেড মডেল ব্যবহার করে করা যেকোনো ইনফারেন্স, ওয়েবের জন্য Firebase AI Logic ক্লায়েন্ট SDK ব্যবহার করে অন্যান্য ইনফারেন্সের মতোই পর্যবেক্ষণ করা যেতে পারে।


Firebase AI Logic ব্যবহারের অভিজ্ঞতা সম্পর্কে মতামত দিন।