Vercel AI SDK

ابثّ chat completions من Venice في تطبيقات Next.js وReact باستخدام مزوّد Vercel AI SDK المتوافق مع OpenAI لواجهات الذكاء الاصطناعي وروبوتات الدردشة في الإنتاج.

تُعدّ Vercel AI SDK الطريقة الأكثر شيوعًا لبناء ميزات الذكاء الاصطناعي في تطبيقات Next.js وReact وSvelte وVue. تعمل Venice مباشرةً كمزوّد متوافق مع OpenAI.

​

الإعداد

npm install ai @ai-sdk/openai

​

تهيئة المزوّد

أنشئ مزوّد Venice باستخدام المحوّل المتوافق مع OpenAI:

// lib/venice.ts
import { createOpenAI } from '@ai-sdk/openai';

const openai = createOpenAI({
  apiKey: process.env.VENICE_API_KEY!,
  baseURL: 'https://api.venice.ai/api/v1',
});

// Use .chat() to ensure compatibility with Venice's chat completions endpoint
export const venice = (modelId: string) => openai.chat(modelId);

استخدام .chat() يضمن توجيه الطلبات إلى نقطة النهاية /chat/completions الخاصة بـ Venice. قد تستخدم الصيغة الافتراضية openai('model') نقاط نهاية OpenAI الأحدث التي لا تدعمها Venice بعد.

​

دردشة بالبث (Next.js App Router)

​

مسار API

// app/api/chat/route.ts
import { streamText } from 'ai';
import { venice } from '@/lib/venice';

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

  const result = streamText({
    model: venice('venice-uncensored'),
    system: 'You are a helpful, privacy-respecting AI assistant.',
    messages,
  });

  return result.toDataStreamResponse();
}

​

مكوّن React

// app/page.tsx
'use client';

import { useChat } from '@ai-sdk/react';

export default function Chat() {
  const { messages, input, handleInputChange, handleSubmit, isLoading } = useChat();

  return (
    <div className="max-w-2xl mx-auto p-4">
      <div className="space-y-4 mb-4">
        {messages.map((m) => (
          <div key={m.id} className={m.role === 'user' ? 'text-right' : 'text-left'}>
            <span className="font-bold">{m.role === 'user' ? 'You' : 'Venice'}:</span>
            <p className="whitespace-pre-wrap">{m.content}</p>
          </div>
        ))}
      </div>

      <form onSubmit={handleSubmit} className="flex gap-2">
        <input
          value={input}
          onChange={handleInputChange}
          placeholder="Ask anything..."
          className="flex-1 border rounded px-3 py-2"
          disabled={isLoading}
        />
        <button type="submit" disabled={isLoading} className="bg-red-600 text-white px-4 py-2 rounded">
          Send
        </button>
      </form>
    </div>
  );
}

​

توليد النص (بدون بث)

import { generateText } from 'ai';
import { venice } from '@/lib/venice';

const { text } = await generateText({
  model: venice('zai-org-glm-5-1'),
  prompt: 'Explain zero-knowledge proofs in simple terms.',
});

console.log(text);

​

المخرجات المهيكلة

import { generateObject } from 'ai';
import { venice } from '@/lib/venice';
import { z } from 'zod';

const { object } = await generateObject({
  model: venice('venice-uncensored'),
  schema: z.object({
    recipe: z.object({
      name: z.string(),
      ingredients: z.array(z.string()),
      steps: z.array(z.string()),
      prepTimeMinutes: z.number(),
    }),
  }),
  prompt: 'Generate a recipe for chocolate chip cookies.',
});

console.log(object.recipe.name);
console.log(`Prep time: ${object.recipe.prepTimeMinutes} minutes`);

​

استدعاء الأدوات (Tool Calling)

import { streamText, tool } from 'ai';
import { venice } from '@/lib/venice';
import { z } from 'zod';

const result = streamText({
  model: venice('zai-org-glm-5-1'),
  messages: [{ role: 'user', content: 'What is the weather in Tokyo?' }],
  tools: {
    getWeather: tool({
      description: 'Get current weather for a location',
      parameters: z.object({
        location: z.string().describe('City name'),
      }),
      execute: async ({ location }) => {
        // Your weather API call here
        return { temperature: 22, condition: 'Sunny', location };
      },
    }),
  },
});

for await (const part of result.fullStream) {
  if (part.type === 'text-delta') {
    process.stdout.write(part.textDelta);
  } else if (part.type === 'tool-result') {
    console.log('Tool result:', part.result);
  }
}

​

توليد الصور

يمكن استدعاء توليد الصور في Venice مباشرةً جنبًا إلى جنب مع AI SDK:

// app/api/image/route.ts
export async function POST(req: Request) {
  const { prompt } = await req.json();

  const response = await fetch('https://api.venice.ai/api/v1/image/generate', {
    method: 'POST',
    headers: {
      'Authorization': `Bearer ${process.env.VENICE_API_KEY}`,
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      model: 'qwen-image',
      prompt,
      width: 1024,
      height: 1024,
    }),
  });

  const data = await response.json();
  return Response.json({ image: data.images[0] });
}

​

دردشة بعدة نماذج (محدد النموذج)

اسمح للمستخدمين بالاختيار بين نماذج Venice:

// app/api/chat/route.ts
import { streamText } from 'ai';
import { venice } from '@/lib/venice';

const ALLOWED_MODELS = [
  'venice-uncensored',
  'zai-org-glm-5-1',
  'qwen3-vl-235b-a22b',
  'qwen3-5-9b',
];

export async function POST(req: Request) {
  const { messages, model: modelId } = await req.json();

  if (!ALLOWED_MODELS.includes(modelId)) {
    return new Response('Invalid model', { status: 400 });
  }

  const result = streamText({
    model: venice(modelId),
    messages,
  });

  return result.toDataStreamResponse();
}

// Client component with model selector
'use client';

import { useChat } from '@ai-sdk/react';
import { useState } from 'react';

const MODELS = [
  { id: 'venice-uncensored', name: 'Venice Uncensored', desc: 'Fast & uncensored' },
  { id: 'zai-org-glm-5-1', name: 'GLM 5.1', desc: 'Most intelligent (private)' },
  { id: 'qwen3-vl-235b-a22b', name: 'Qwen Vision', desc: 'Advanced vision + text' },
  { id: 'qwen3-5-9b', name: 'Qwen 3.5 9B', desc: 'Fastest & cheapest' },
];

export default function Chat() {
  const [model, setModel] = useState('venice-uncensored');
  const { messages, input, handleInputChange, handleSubmit } = useChat({
    body: { model },
  });

  return (
    <div>
      <select value={model} onChange={(e) => setModel(e.target.value)}>
        {MODELS.map((m) => (
          <option key={m.id} value={m.id}>{m.name} — {m.desc}</option>
        ))}
      </select>
      {/* ... chat UI ... */}
    </div>
  );
}

​

دمج البحث على الويب

مرّر معاملات Venice الخاصة بالبحث على الويب:

import { streamText } from 'ai';
import { venice } from '@/lib/venice';

const result = streamText({
  model: venice('venice-uncensored'),
  messages: [{ role: 'user', content: 'What happened in AI news today?' }],
  // Venice-specific parameters
  experimental_providerMetadata: {
    venice_parameters: {
      enable_web_search: 'auto',
    },
  },
});

إذا لم يتم تمرير experimental_providerMetadata بشكل صحيح، يمكنك استخدام غلاف fetch مخصص أو استدعاء Venice API مباشرةً لميزات البحث على الويب.

​

التضمينات (Embeddings)

للتضمينات، استخدم textEmbeddingModel() على المزوّد مباشرةً:

import { embed, embedMany } from 'ai';
import { createOpenAI } from '@ai-sdk/openai';

const openai = createOpenAI({
  apiKey: process.env.VENICE_API_KEY!,
  baseURL: 'https://api.venice.ai/api/v1',
});

// Single embedding
const { embedding } = await embed({
  model: openai.textEmbeddingModel('text-embedding-bge-m3'),
  value: 'Privacy-first AI infrastructure',
});

// Batch embeddings
const { embeddings } = await embedMany({
  model: openai.textEmbeddingModel('text-embedding-bge-m3'),
  values: [
    'Venice AI provides private inference.',
    'Zero data retention guaranteed.',
    'OpenAI SDK compatible.',
  ],
});

​

متغيرات البيئة

# .env.local
VENICE_API_KEY=your-venice-api-key

​

النماذج الموصى بها

حالة الاستخدام	النموذج	السبب
تطبيقات الدردشة	venice-uncensored	سريع ورخيص وبلا تصفية
المهام المعقدة	zai-org-glm-5-1	نموذج رائد خاص للاستدلال
تطبيقات الرؤية	qwen3-vl-235b-a22b	فهم متقدّم للصور
الحجم الكبير	qwen3-5-9b	الأرخص بسعر 0.10 دولار لكل مليون إدخال و0.15 دولار لكل مليون إخراج
استدعاء الأدوات	zai-org-glm-5-1	استدعاء دوال موثوق

وثائق Vercel AI SDK

وثائق Vercel AI SDK الرسمية

نماذج Venice

تصفّح جميع نماذج Venice