Danial.bakhtiari
هوش مصنوعی در توسعه

پیاده‌سازی سیستم RAG (Retrieval-Augmented Generation) در Next.js برای چت‌بات‌های اختصاصی

Galia Darabidian8 دقیقه مطالعهبازدید: ۲
build-rag-chatbot-nextjs

مقاله مرتبط

معماری AI Agents در برنامه‌های وب؛ توسعه با Cursor و GitHub Copilot

معماری AI Agent در برنامه‌های وب را بشناسید؛ از تفاوت Agent با LLM و Chatbot تا کاربرد Cursor و GitHub Copilot در توسعه و کدنویسی هوشمند.

ادامه مطلب

چت‌بات‌های هوش مصنوعی می‌توانند به سؤال‌های کاربران پاسخ دهند، همیشه به اطلاعات اختصاصی یک پروژه دسترسی ندارند. برای مثال، یک فروشگاه آنلاین ممکن است بخواهد چت‌باتی داشته باشد که درباره محصولات، شرایط ارسال یا قوانین مرجوعی پاسخ دهد.

اینجاست که RAG (Retrieval-Augmented Generation) یا «تولید پاسخ با کمک بازیابی اطلاعات» کاربرد پیدا می‌کند، RAG به سیستم اجازه می‌دهد قبل از تولید پاسخ، اطلاعات مرتبط را از منابع مشخص پیدا کند و در اختیار مدل هوش مصنوعی قرار دهد.

در این مقاله، یک RAG Chatbot را با Next.js می‌سازیم و با نقش Vector Database، Embedding، Next.js AI SDK و OpenAI API در این فرایند آشنا می‌شویم.

RAG چیست؟

ایده RAG ساده است: وقتی کاربر سؤالی می‌پرسد، سیستم ابتدا اطلاعات مرتبط را از منابع مشخص پیدا می‌کند و سپس آن اطلاعات را همراه با سؤال در اختیار مدل قرار می‌دهد تا پاسخ تولید شود.

فرض کنید اطلاعات فروشگاه در یک مجموعه مستندات قرار دارد:

شرایط مرجوعی: محصولات تا ۷ روز پس از خرید امکان مرجوعی دارند.

کاربر می‌پرسد:

«این محصول را می‌توانم مرجوع کنم؟»

RAG ابتدا بخش مرتبط با «مرجوعی» را پیدا می‌کند و آن را در اختیار مدل قرار می‌دهد. مدل نیز با استفاده از این اطلاعات پاسخ می‌دهد:

«بله، محصولات تا ۷ روز پس از خرید امکان مرجوعی دارند.»

بنابراین، پاسخ از اطلاعاتی می‌آید که ما در اختیار سیستم قرار داده‌ایم، نه اینکه مدل از قبل اطلاعات فروشگاه را می‌دانسته باشد.

همان‌طور که در مقاله قبل درباره AI Agentها و اهمیت Context صحبت کردیم. RAG هم با پیدا کردن اطلاعات مرتبط از منابع خارجی، اطلاعات موردنیاز را در اختیار مدل قرار می‌دهد تا بتواند پاسخ مناسب‌تری تولید کند.

RAG چگونه کار می‌کند؟

فرایند RAG را می‌توان در دو بخش اصلی در نظر گرفت:

۱. آماده‌سازی و ذخیره اطلاعات

در این مرحله، اطلاعات از منابع مختلف دریافت و برای جست‌وجو آماده می‌شوند:

Documents → Chunking → Embedding → Vector Database

۲. دریافت سؤال و تولید پاسخ

در زمان سؤال کاربر، اطلاعات مرتبط بازیابی شده و در اختیار مدل قرار می‌گیرد:

User Question → Retrieval → Relevant Context → LLM → Final Answer

این تفکیک مهم است؛ چون آماده‌سازی اطلاعات معمولاً قبل از استفاده کاربر انجام می‌شود، در حالی که Retrieval و تولید پاسخ هنگام ارسال سؤال اتفاق می‌افتند.

۱. آماده‌سازی اطلاعات

ابتدا اطلاعاتی را که چت‌بات باید از آن‌ها استفاده کند آماده می‌کنیم؛ مثلاً مقالات، مستندات، اطلاعات محصولات یا فایل‌های متنی.

اگر متن طولانی باشد، آن را به بخش‌های کوچک‌تری به نام Chunk تقسیم می‌کنیم.

۲. ساخت Embedding

هر Chunk به یک Embedding تبدیل می‌شود. Embedding را می‌توان یک نمایش عددی از معنای متن در نظر گرفت که به سیستم کمک می‌کند متن‌های مرتبط را پیدا کند.

سپس این Embeddingها در یک Vector Database ذخیره می‌شوند.

۳. دریافت سؤال کاربر

وقتی کاربر سؤال می‌پرسد، سؤال نیز به Embedding تبدیل می‌شود.

۴. بازیابی اطلاعات

سیستم سؤال را با اطلاعات ذخیره‌شده مقایسه می‌کند و مرتبط‌ترین Chunkها را پیدا می‌کند.

این مرحله Retrieval نام دارد.

Retriever چیست؟

Retriever بخشی از سیستم RAG است که مسئول پیدا کردن اطلاعات مرتبط با سؤال کاربر است. Retriever می‌تواند از Vector Search برای پیدا کردن نزدیک‌ترین Chunkها استفاده کند و نتیجه را به مرحله تولید پاسخ ارسال کند.

۵. تولید پاسخ

اطلاعات پیدا‌شده همراه با سؤال کاربر به مدل زبانی ارسال می‌شود.

Question + Relevant Context → OpenAI API → Answer

مدل با استفاده از این Context پاسخ نهایی را تولید می‌کند.

اجزای اصلی سیستم RAG

برای ساخت این سیستم به چند بخش اصلی نیاز داریم:

  • Next.js: ساخت اپلیکیشن و API
  • OpenAI API: تولید Embedding و پاسخ نهایی
  • Vector Database: ذخیره و پیدا کردن اطلاعات مرتبط
  • Next.js AI SDK: ساده‌تر کردن ارتباط بین اپلیکیشن و مدل‌های هوش مصنوعی
  • Retriever: پیدا کردن اطلاعات مرتبط با سؤال

در این معماری، هر بخش وظیفه مشخصی دارد و در کنار هم فرایند RAG را تشکیل می‌دهند.

پیاده‌سازی RAG در Next.js

حالا می‌توانیم همین فرایند را در یک پروژه واقعی پیاده کنیم.

۱. ساخت پروژه Next.js

ابتدا یک پروژه Next.js ایجاد می‌کنیم و پکیج‌های موردنیاز برای OpenAI و AI SDK را نصب می‌کنیم.

برای مثال، می‌توان پروژه را با TypeScript و App Router ایجاد کرد:

npx create-next-app@latest rag-chatbot
cd rag-chatbot

سپس پکیج‌های موردنیاز را نصب می‌کنیم:

npm install openai ai

ساختار ساده پروژه می‌تواند به شکل زیر باشد:

app/
├── api/
│   └── chat/
│       └── route.ts
├── page.tsx
└── ...

صفحه اصلی رابط Chatbot را نمایش می‌دهد و API Route درخواست‌های کاربر را پردازش می‌کند.

۲. تنظیم API Key

برای ارتباط با OpenAI، کلید API را در متغیر محیطی پروژه قرار می‌دهیم:

OPENAI_API_KEY=your_api_key

این مقدار نباید مستقیماً داخل کد یا سمت Client قرار بگیرد.

۳. آماده‌سازی و Chunk کردن داده‌ها

فرض کنیم اطلاعات یک فروشگاه را در اختیار داریم.

برای مثال:

شرایط ارسال: ارسال سفارش‌ها بین ۲ تا ۴ روز کاری انجام می‌شود.

شرایط مرجوعی: محصول تا ۷ روز پس از خرید قابل مرجوعی است.

اگر اطلاعات زیاد باشند، آن‌ها را به Chunkهای کوچک‌تر تقسیم می‌کنیم:

Document → Chunk 1, Chunk 2, Chunk 3

این کار کمک می‌کند هنگام جست‌وجو، بخش مرتبط‌تری از اطلاعات پیدا شود.

۴. ساخت Embedding و ذخیره در Vector Database

حالا هر Chunk را با استفاده از OpenAI به Embedding تبدیل می‌کنیم:

Chunk → OpenAI Embedding → Vector → Vector Database

Vector Database این بردارها را ذخیره می‌کند تا بعداً بتوانیم اطلاعات مرتبط را بر اساس شباهت معنایی پیدا کنیم.

در یک پروژه واقعی، در این مرحله باید یک Vector Database مشخص انتخاب و Embeddingها همراه با متن اصلی Chunkها در آن ذخیره شوند.

۵. پیاده‌سازی Retrieval

وقتی کاربر سؤالی می‌پرسد، سؤال او نیز به Embedding تبدیل می‌شود.

برای مثال:

«سفارش من چند روزه می‌رسه؟»

سیستم به دنبال Chunkهایی می‌گردد که از نظر معنایی به این سؤال نزدیک باشند.

User Question → Embedding → Vector Search → Relevant Chunks

در این مثال، Chunk مربوط به «زمان ارسال سفارش» پیدا می‌شود.

۶. ارسال Context به OpenAI

حالا Chunk پیدا‌شده را همراه با سؤال کاربر به OpenAI ارسال می‌کنیم.

Question + Retrieved Context → OpenAI → Final Answer

برای مثال، اگر Context شامل این اطلاعات باشد:

«ارسال سفارش‌ها بین ۲ تا ۴ روز کاری انجام می‌شود.»

مدل می‌تواند پاسخ دهد:

«سفارش شما بین ۲ تا ۴ روز کاری ارسال می‌شود.»

در نتیجه، مدل پاسخ را بر اساس اطلاعاتی تولید می‌کند که سیستم از منابع پروژه پیدا کرده است.

اگر اطلاعات کافی وجود نداشته باشد چه می‌شود؟

یکی از نکات مهم در RAG این است که مدل نباید اطلاعاتی را که در Context وجود ندارد، به‌صورت حدسی تولید کند. بنابراین می‌توان در Prompt سیستم مشخص کرد که اگر پاسخ سؤال در اطلاعات بازیابی‌شده وجود نداشت، مدل اعلام کند که اطلاعات کافی برای پاسخ‌گویی ندارد.

برای مثال:

«اگر پاسخ سؤال در Context ارائه‌شده وجود ندارد، از حدس زدن خودداری کن و اعلام کن که اطلاعات کافی در منابع موجود نیست.»

این کار به کاهش پاسخ‌های بدون پشتوانه کمک می‌کند.

۷. ساخت Chatbot با Next.js AI SDK

حالا می‌توانیم این فرایند را به رابط کاربری متصل کنیم.

کاربر سؤال خود را در Chatbot وارد می‌کند، درخواست به API ارسال می‌شود، اطلاعات مرتبط از Vector Database بازیابی می‌شود و Context به OpenAI ارسال می‌شود.

جریان کامل سیستم به این شکل است:

User → Next.js Chat UI → AI SDK → Retriever → Vector Database → Relevant Context → OpenAI API → Answer → Chat UI

Next.js AI SDK در این قسمت کمک می‌کند ارتباط بین رابط کاربری، API و مدل هوش مصنوعی ساده‌تر مدیریت شود.

نمونه ساده API Route

در یک پیاده‌سازی ساده، API Route می‌تواند درخواست کاربر را دریافت کرده و پس از بازیابی اطلاعات، Context را همراه سؤال به مدل ارسال کند:

import OpenAI from "openai";

const openai = new OpenAI({
  apiKey: process.env.OPENAI_API_KEY,
});

export async function POST(req: Request) {
  const { question, context } = await req.json();

  const response = await openai.responses.create({
    model: "gpt-5",
    input: `
بر اساس Context زیر به سؤال پاسخ بده.
اگر پاسخ در Context وجود ندارد، حدس نزن.

Context:
${context}

Question:
${question}
`,
  });

  return Response.json({
    answer: response.output_text,
  });
}

در پروژه واقعی، مقدار context از Retriever و Vector Database دریافت می‌شود و مستقیماً از کاربر گرفته نمی‌شود.

۸. تست و بررسی RAG

بعد از ساخت Chatbot، باید آن را با سؤال‌های واقعی آزمایش کنیم.

برای مثال:

  • آیا اطلاعات درست از Vector Database پیدا می‌شود؟
  • آیا Context مناسب به مدل ارسال می‌شود؟
  • آیا پاسخ بر اساس اطلاعات موجود تولید می‌شود؟
  • اگر جواب سؤال در منابع وجود نداشته باشد، سیستم چه پاسخی می‌دهد؟

این مرحله مهم است، چون کیفیت یک سیستم RAG فقط به مدل زبانی وابسته نیست. کیفیت اطلاعات، Chunking و Retrieval نیز روی پاسخ نهایی تأثیر دارند.

جمع‌بندی

RAG به ما اجازه می‌دهد چت‌باتی بسازیم که هنگام پاسخ‌گویی از اطلاعات اختصاصی یک پروژه استفاده کند.

در این فرایند، اطلاعات ابتدا به Chunk تقسیم و به Embedding تبدیل می‌شوند. سپس Embeddingها در Vector Database ذخیره می‌شوند. هنگام سؤال کاربر، اطلاعات مرتبط بازیابی شده و همراه با سؤال به OpenAI API ارسال می‌شوند تا پاسخ تولید شود.

در این مقاله، مسیر ساخت یک RAG Chatbot با Next.js، Next.js AI SDK، OpenAI API و Vector Database را از آماده‌سازی اطلاعات تا Retrieval و تولید پاسخ بررسی کردیم.

اما استفاده از AI در توسعه وب فقط به ساخت چت‌بات محدود نمی‌شود. در مقاله بعدی، سراغ تولید سریع‌تر رابط‌های کاربری و کدهای Frontend با ابزارهای AI می‌رویم و ابزارهایی مانند ابزارهای AI برای تولید رابط کاربری و راهکارهای Figma to Code را بررسی می‌کنیم.

مطالب مرتبط