Bolt пен CometAPI көмегімен ЖИ бейне генераторын қалай құруға болады: қадамдық нұсқаулық

TL;DR

Bolt қолданба интерфейсін генерациялай алады, ал CometAPI видео-генерация API-сын ұсынады. CometAPI кілтін серверде сақтаңыз, Vidu тапсырмаларын POST /v1/videos арқылы жіберіңіз, қайтарылған task ID-ны поллиң жасап тексеріңіз және дайын видеоны аутентификацияланған алдын ала қарау мен жүктеу маршруттары арқылы ұсыныңыз. Сізге Bolt жобасы, таңдалған модельге қолжетімділігі бар және қаражатпен қамтамасыз етілген CometAPI аккаунты, сондай-ақ серверлік функциялар орындалу ортасы қажет; төмендегі мысалдар интеграцияның өзегін үйретеді, ал аутентификация, квоталар, иелік тексерулері және тұрақты жұмыс жазбалары іске қосу алдында міндетті түрде жүзеге асырылуы тиіс.

Негізгі тұжырымдар

• Bolt табиғи тілдегі қолданба сипаттамасынан жауап беретін видео студия UI-ін генерациялайды.

• CometAPI қорғалған сервер жақтағы API кілтін қолданып, қолдау көрсетілетін генерация модельдері арқылы видео инференсін ұсынады.

• Мәтіннен видеоға (text-to-video) бастап, жұмыс өмірлік циклі расталғаннан кейін image-to-video-ға кеңейтіңіз.

• Өндірістік дайындық үшін аутентификация, квоталар, тапсырма иелігін тексеру, қайталап көру және тұрақты нәтижелерді сақтау қажет.

• Нақты құндылықты аяқтау үлесі, латенттілік, қабылданған клип құны және промптқа сәйкестік арқылы өлшеңіз.

AI видео генерациясы үшін Bolt және CometAPI не үшін қажет?

Bolt интерфейсті, қолданба логикасын және жариялау жұмыс ағынын құрады. Bolt Cloud дерекқор, хостинг, аутентификация, сақтау және серверлік функциялар сияқты жоба сервистерін ұсынады. CometAPI модель API қолжетімділігін, соның ішінде қолдау көрсетілетін видео модельдері мен инференс эндпойнттарын қамтамасыз етеді. Ақылы инференсті аутентификацияланған серверлік функциялардың артына жасырыңыз, тұрақты жұмыс жазбаларын, иелік тексерулерін және биллинг бақылауларын қосыңыз.

CometAPI OpenAI-мен үйлесімді ме?

CometAPI қолдау көрсетілетін мәтін және чат модельдері үшін OpenAI-мен үйлесімді интерфейстер ұсынады. Қолданатын SDK және маршрутыңызға сәйкес эндпойнт пен модельді конфигурациялаңыз; үйлесімділік барлық модельдер бірдей сұрау схемасын қабылдайды дегенді білдірмейді.

Vidu видео API OpenAI-мен үйлесімді чат интерфейсінен бөлек. Видео құру multipart/form-data көмегімен POST /v1/videos арқылы жүзеге асады, сондықтан қолданба видео эндпойнтты тікелей қорғалған серверлік функциядан шақыруы керек.

CometAPI Vidu видео API қалай жұмыс істейді?

Видео тапсырмасын жасау

multipart/form-data арқылы POST /v1/videos жіберу арқылы тапсырма жасаңыз. Бұл оқулық viduq3 қолданады; viduq3-turbo — құжатталған тағы бір опция. API кілтіңізде модельге қолжетімділік барын растаңыз және қайтарылған task ID-ны сақтаңыз. Жасау API анықтамалығын қараңыз.

POST /v1/videos параметрлері

Төмендегі кестеде жасау кірістері көрсетілген. Скалярлы форма өрістерін жол ретінде жіберіңіз. seconds үшін "1" мен "16" аралығындағы бүтін мәнді жолды пайдаланыңыз; қолданба сериализация алдында сандық ұзақтықты тексере алады. Оқулықтағы 2 000 таңбалық промпт шегі — қолданба саясаты.

Сервер id мәнін тапсырма идентификаторы ретінде қайтарады; ол жасау параметрі емес. Оны сұраушы пайдаланушының жұмыс жазбасымен бірге сақтаңыз және кейінгі күй және контент сұраулары үшін пайдаланыңыз. Жоғарыдағы сызылған id жолы тек жою фактісін көрсету үшін қалдырылған.

• 540p деңгейі: Тәжірибелер үшін API size мәні 960x528 қолданыңыз.
• 720p деңгейі: Веб алдын ала қарау үшін 1280x720 қолданыңыз.
• 1080p деңгейі: Жоғары сапалы жеткізу үшін 1920x1080 қолданыңыз.

Сервер жақтағы тексеру қолдау көрсетілмейтін комбинацияларды қабылдамай, пайдаланушылардың шектелмеген ақылы генерация сұрауларын жіберуіне жол бермеуі тиіс.

Тапсырма күйін поллиң жасау

Иелік тексерілгеннен кейін бэкендтен GET /v1/videos/{task_id} тексеріңіз. Тапсырма терминалдық күйге жеткенше жалғастырыңыз; бет жаңартуы немесе браузер таймауты бір жұмысты қайта жалғастыра алуы үшін task ID-ны сақтаңыз.

Дайын видеоны жүктеп алу

Аяқталғаннан кейін, бэкенд арқылы GET /v1/videos/{task_id}/content сұраңыз және нәтижені ағызып жіберіңіз немесе бақыланатын сақтауға орналастырыңыз. Төмендегі іске асыру қадамдары осы операцияларды Bolt-пен қалай байланыстыруды көрсетеді.

Bolt + CometAPI көмегімен AI видео генераторын қалай құруға болады

1-қадам: Bolt-та жобаны жасау

Bolt ашып, одан React + TypeScript жобасын жасауын сұраңыз. Төмендегі спецификацияны промпт жолағына қойып, ақылы генерацияны қоспас бұрын генерацияланған интерфейсті қарап шығыңыз:

Build a responsive AI Video Studio using React, TypeScript, and Tailwind CSS.
Use a dark-themed layout with prompt editing, example prompts, 5/10/15-second
choices, 540p/720p/1080p options, Generate Video button, job status,
video preview and download, and a recent-generations section.
Use Bolt Cloud authentication, database, and server functions.
Require sign-in before video creation. Store COMETAPI_KEY only in server secrets.
Create authenticated generate-video and video-status server endpoints.
Connect to real CometAPI tasks; poll status every 10 seconds.
Do not use mock videos in the production path.

2-қадам: CometAPI API кілтін баптау

CometAPI-де API кілтін жасап, бэкенд құпиясы ретінде COMETAPI_KEY атауымен қосыңыз. Оны ешқашан фронтенд көздер файлына сақтамаңыз, браузер кодына шығармаңыз немесе VITE_ префиксті орта айнымалысы ретінде пайдаланбаңыз.

Bolt жобасының баптауларында COMETAPI_KEY мәнін жобаның сервер жақтағы құпияларды басқару интерфейсі арқылы қосыңыз. Оны фронтенд көз кодына қоймаңыз немесе браузер JavaScript-іне шығармаңыз. Төмендегі жол — атау үлгісі ғана, фронтенд .env файлы емес.

COMETAPI_KEY=your_actual_cometapi_api_key

3-қадам: Видео генерация тапсырмасын жіберу

Төмендегі Deno-стиліндегі функция провайдерге сұрау жіберудің өзегін көрсетеді. Ол өндіріс алдында нақты сессия валидациясымен, квоталармен және пайдаланушыға тиесілі жұмыс жазбаларымен қоршалуы тиіс.

Бұл мысал Supabase-стиліндегі Deno edge функциясы құрылымын қолданады. Bolt-тан оны жобаңызға нақты конфигурацияланған сервер орындалу ортасына орналастыруын сұраңыз. Аутентификация және тұрақтылыққа қатысты түсініктемелер — интеграция нүктелері, қорғаныс шаралары емес: бұл қаңқаны ашық ақылы эндпойнт ретінде орналастырмаңыз.

// supabase/functions/generate-video/index.ts
import { serve } from "https://deno.land/std/http/server.ts";
serve(async (req: Request) => {
  if (req.method !== "POST") return Response.json({error:"Method not allowed"},{status:405});
  try {
    // Verify the signed-in user and enforce quotas here.
    const {prompt, seconds, size} = await req.json();
    const sizes = ["960x528", "1280x720", "1920x1080"];
    if (typeof prompt !== "string" || !prompt.trim() || prompt.length > 2000 ||
        !Number.isInteger(seconds) || seconds < 1 || seconds > 16 ||
        !sizes.includes(size)) {
      return Response.json({error:"Invalid options"},{status:400});
    }
    const key = Deno.env.get("COMETAPI_KEY");
    if (!key) throw new Error("Missing API key");
    const form = new FormData();
    form.append("model", "viduq3");
    form.append("prompt", prompt.trim());
    form.append("seconds", String(seconds));
    form.append("size", size);
    const response = await fetch("https://api.cometapi.com/v1/videos", {
      method: "POST", headers: {Authorization: `Bearer ${key}`}, body: form,
      signal: AbortSignal.timeout(60000)
    });
    if (!response.ok) throw new Error(`Provider status ${response.status}`);
    const result = await response.json();
    const taskId = result.id ?? result.task_id;
    if (!taskId) throw new Error("Task ID missing");
    // Persist taskId and owner ID in application database here.
    return Response.json({taskId, status: result.status ?? "queued"});
  } catch (e) {
    console.error(e);
    return Response.json({error:"Unable to create video"},{status:500});
  }
});

4-қадам: Генерация күйін алу

Жіберу асинхронды job ID қайтарады. Сұраушы пайдаланушының жұмысына иелік ететінін тексергеннен кейін серверлік эндпойнт арқылы GET /v1/videos/{task_id} тексеріңіз.

// Server-only helper
async function getVideoStatus(taskId: string) {
  const key = Deno.env.get("COMETAPI_KEY");
  if (!key) throw new Error("Missing API key");
  const response = await fetch(
    `https://api.cometapi.com/v1/videos/${encodeURIComponent(taskId)}`,
    {headers: {Authorization: `Bearer ${key}`}, signal: AbortSignal.timeout(60000)}
  );
  if (!response.ok) throw new Error(`Status ${response.status}`);
  const task = await response.json();
  return {taskId, status: task.status, progress: task.progress ?? null};
}

Тапсырма бастапқыда queued күйінде болады, in_progress күйіне ауысуы мүмкін және completed, failed немесе error күйімен аяқталады. Тек completed болғаннан кейін алдын ала қарау мен жүктеуді қосыңыз; терминалдық сәтсіздік күйлері үшін қателерді көрсетіп, жаңа сұрауға рұқсат беріңіз.

5-қадам: Bolt фронтендімен байланыстыру

type VideoTask = {taskId: string; status: string; progress?: number | null};
async function startVideo(prompt: string, seconds: number, size: string): Promise<VideoTask> {
  const res = await fetch("/api/generate-video", {
    method: "POST", headers: {"Content-Type":"application/json"},
    body: JSON.stringify({prompt, seconds, size})
  });
  if (!res.ok) throw new Error("Generation request failed");
  return res.json();
}
async function checkVideo(taskId: string): Promise<VideoTask> {
  const res = await fetch(`/api/video-status?id=${encodeURIComponent(taskId)}`);
  if (!res.ok) throw new Error("Status request failed");
  return res.json();
}
async function waitForVideo(taskId: string, onUpdate: (task: VideoTask) => void) {
  const deadline = Date.now() + 20 * 60 * 1000;
  while (Date.now() < deadline) {
    const task = await checkVideo(taskId);
    onUpdate(task);
    if (task.status === "completed") return task;
    if (["failed", "error"].includes(task.status)) throw new Error("Render failed");
    await new Promise(resolve => setTimeout(resolve, 10000));
  }
  throw new Error("Polling paused; resume this task ID before submitting again");
}

/api/ жолдары — сіз баптайтын қолданбалық маршруттар. Bolt Cloud серверлік функциялары үшін генерацияланған бэкенд клиентін және аутентификацияланған эндпойнт URL-мекенжайларын пайдаланыңыз. Компонент демонтаждалғанда поллиңді тоқтатыңыз және 429/5xx жауаптары үшін шектелген backoff қолданыңыз. Браузерлік поллиң дедлайны провайдер сәтсіздігін дәлелдемейді: task ID-ны сақтаңыз және жаңа ақылы тапсырма жасамас бұрын күй тексерулерін қайта жалғастырыңыз.

6-қадам: Нәтижені алдын ала қарау және жүктеп алу

Жұмыс аяқталған кезде, бэкенд GET /v1/videos/{task_id}/content алады. Деректерді аутентификацияланған job иесіне ағызыңыз немесе бақыланатын объектілік сақтауға сақтап, авторизацияланған URL беріңіз. CometAPI bearer кілтін ешқашан браузерде көрсетпеңіз.

Қолданба алдын ала қарау компоненті үшін пайдаланушыға тиесілі контент маршрутын немесе авторизацияланған сақтау URL-мекенжайын ұсынуы тиіс. Қол қоюлы URL кімде болса, мерзімі біткенге дейін қолжетімді; оның өмірін қысқа ұстаңыз. Сенімді жүктеп алу үшін, браузерлер cross-origin URL-мекенжайлары үшін download атрибутын елемеуі мүмкін болғандықтан, сәйкес Content-Disposition тақырыбы бар бір шығу текті маршрутты пайдаланыңыз.

type VideoPreviewProps = {videoUrl: string};
export function VideoPreview({videoUrl}: VideoPreviewProps) {
  return <div className="rounded-xl p-4">
    <video controls playsInline className="w-full rounded-lg" src={videoUrl}/>
    <a href={videoUrl} download="ai-generated-video.mp4">Download Video</a>
  </div>;
}

7-қадам: Тестілеу және жариялау

Алдымен 5 секундтық 540p сұрауын сынаңыз: “Қараңғы үстелде тұрған күміс смарт-сағаттың кинематографиялық жақын түсірілімі. Камера солдан оңға баяу қозғалады. Таңғы жұмсақ жарық металдан шағылады.” Бір сұрау бір тапсырма жасайтынын, күйі алға жылжитынын, нәтиже ойналатынын және жүктеп алудың сәтті болатынын тексеріңіз. Жарияламас бұрын жарамсыз промпттарды, мерзімі өткен сессияларды, rate limiting-ті, тапсырма иелігін және провайдер сәтсіздіктерін сынаңыз.

Аяқтау тексеруі: екінші пайдаланушы ретінде кіріп, бірінші пайдаланушының жұмысы оқыла алмайтынын немесе жүктеп алынбайтынын растаңыз; рендеринг кезінде бетті жаңартып, сақталған тапсырманы қалпына келтіруге болатынын тексеріңіз; браузер сұрауларын және құрастырылған активтерді кездейсоқ кілт жариялануына тексеріңіз. Ойнату және жүктеп алу тесттерімен қатар осы үш тексеріс те өткеннен кейін ғана жариялаңыз.

Image-to-Video генерациясын қалай қосуға болады?

Image-to-video үшін multipart денесінде input_reference ретінде бір расталған сурет файлын қосыңыз. Ағымдағы маршрут бір сурет үшін 20 MB дейінгі максимумды құжаттайды; қажет болса, қолданба деңгейінде одан кіші шекті қолданыңыз және серверде контент түрін әрі нақты файл мазмұнын тексеріңіз. Суретті аутентификацияланған бэкенд арқылы жіберіңіз; CometAPI кілтін браузерлік жүктеумен бірге жібермеңіз.

const form = new FormData();
form.append("model", "viduq3");
form.append("prompt", prompt);
form.append("seconds", "5");
form.append("size", "1280x720");
form.append("input_reference", imageFile);
const response = await fetch("https://api.cometapi.com/v1/videos", {
  method: "POST", headers: {Authorization: `Bearer ${apiKey}`}, body: form
});
if (!response.ok) throw new Error(`API ${response.status}`);
const result = await response.json();
console.log(result.id ?? result.task_id);

Сурет кірістері үшін қалаған қозғалыс пен камера әрекетін сахнаны қайталай салудан гөрі сипаттаңыз: “Кейіпкер терезеге қарай бұрылады. Перделер жеңіл желмен баяу тербеледі. Бетті, киімді және жарықты сақтаңыз. Камераның алға қарай елеусіз қозғалысын қолданыңыз.”

Vidu Q3 және басқа AI видео модельдері: Нені өлшеу керек?

Модельдерді бірдей промпттар, ұзақтық, ажыратылымдылық және қабылдау критерийлері бойынша салыстырыңыз. Бұл бөлім салыстыру әдісін анықтайды; ол сыналған жеңімпазды жарияламайды. Жарияланатын кез келген нәтижелер үшін модель нұсқасын, маршрутты, тест күні мен үлгі санын жазып отырыңыз.

• Аяқтау үлесі: Сенімділікті өлшеу үшін сәтті жұмыстарды жіберілген жұмыстарға бөліңіз.
• Латенттілік: Типтік тәжірибе мен баяу сұрауларды түсіну үшін P50 және P95 өңдеу уақытын қадағалаңыз.
• Промптқа сәйкестік: Шығыстардың сұралған нұсқауларды қаншалықты сақтайтынын бағалау үшін адамдық шолу немесе стандартталған бағалау қолданыңыз.
• Уақытша тұрақтылық: Көрнекі тұрақтылықты бағалау үшін кадрдан кадрға үздіксіздікті тексеріңіз.
• Аудио синхрондау: Диалог пен дыбыстың уақытталуы және түсініктілігін бағалаңыз.
• Қабылданған клип құны: Операциялық экономиканы түсіну үшін жалпы шығынды мақұлданған нәтижелер санына бөліңіз.

CometAPI видео генерация API-ының құны қандай?

Төмендегі кесте CometAPI-дегі Vidu Q3 және Vidu Q3 Turbo API-лары үшін анықтамалық бағаларды береді. Нақты шығындар модельге, ажыратылымдылыққа және генерация баптауларына байланысты өзгеруі мүмкін. Видео генерация бюджетіңізді есептемес бұрын CometAPI аккаунтыңыздағы соңғы баға мен модель қолжетімділігін тексеріңіз.

CometAPI-дегі Vidu Q3 Turbo API секундына $0.028 бастап бағаланады. Баға ажыратылымдылыққа, генерация режиміне және модель нұсқасына қарай өзгеруі мүмкін. Видеоларды генерацияламас бұрын ағымдағы тарифтерді CometAPI аккаунтыңыздан тексеріңіз.

Жоғарыдағы бағалар стандартты text-to-video және image-to-video генерациясына қолданылады. Басқа генерация режимдері немесе анықтама-сурет конфигурациялары әртүрлі тарифтерге ие болуы мүмкін. Қосымша шығындар — салықтар, сақтау, трафик және қайталап генерациялау талпыныстары — есепке алынбайды.

Анықтамалық тарифтерге сүйенсек, бес секундтық 720p видео Vidu Q3 арқылы шамамен $0.616 немесе Vidu Q3 Turbo арқылы $0.308 тұрады. 540p үшін сәйкес есептер $0.280 және $0.140. Бұл мәндер иллюстративті есептеулер болып табылады, кепілдендірілген төлемдер емес. Дәл бюджеттеу үшін болжалды шығындарды нақты API пайдалануы және биллинг жазбаларымен салыстырыңыз.

Бар видео генераторды Bolt + CometAPI-ға қалай көшіруге болады?

Провайдер адаптерінің артына біртіндеп көшіру жүргізіңіз. Сұрауларды және шығыс мінез-құлқын валидациялаңыз, пайдаланушылардың аз үлесінен бастаңыз, сәттілік деңгейі мен латенттілікті салыстырыңыз және өнімділік қанағаттанарлық болғанша кері қайту маршрутын сақтаңыз.

Жиі қойылатын сұрақтар

Бекітілген визуалды стильді серия бойына қалай қайталама етуге болады?

Бекітілген клипті қайта өндірілетін креативтік спецификация ретінде қарастырыңыз: дәл промптты, модель мен маршрутын, ұзақтығын, ажыратылымдылығын, анықтама-актив нұсқасын және шығыс идентификаторын сақтаңыз. Аз ғана анықтама-суреттер жиынтығын және жарық, объектив, палитра, пән детальдары туралы бірізді сипаттаманы қолданыңыз. Қай нәрсе көмектескенін анықтау үшін әр итерацияда бір негізгі айнымалыны өзгертіңіз. Қайталанған промпт бірдей шығысты кепілдемейді; маршрут seed ұсынса, оны жазып алыңыз, бірақ клипті жинақтауға дейін үздіксіздік үшін бәрібір қарап шығыңыз.

Әр генерация қысқа клип болғанда, көпкадрлы әңгіме қалай бірізді қалады?

Сценарийді бір анық әрекеті және бастау мен аяқталу композициясы бар кадрларға бөліңіз. Кейіпкер түрі, киім, реквизит, жарық және камера бағытына арналған үздіксіздік парағын жүргізіңіз. Қолдау болса, тек прозамен шектелмей, келесі кадрға бекітілген кадрды анықтама-сурет ретінде беріңіз. Монтажды бөлек кезеңде жинақтап, қиып, аудионы теңестіріңіз. Өтулерді тізбек ретінде қарап шығыңыз: жеке алғанда күшті көрінетін клип көршісіне қойылғанда үздіксіздікті бұзуы мүмкін.

Ақылы жіберілімнен кейін браузер таймаутқа ұшыраса не істеу керек?

Мұны сақталған провайдер тапсырмасы келісілгенге дейін белгісіз нәтиже ретінде қарастырыңыз. Жергілікті қолданбалық сұрау идентификаторын және провайдер task ID-ны сақтаңыз, пайдаланушының сол жұмысты қайта ашуына және күй тексерулерін жалғастыруына рұқсат беріңіз. Егер жіберу task ID қайтармай тұрып таймаутқа ұшыраса, басқа талпыныс ұсынбас бұрын қолжетімді сұрау журналдары мен пайдалану жазбаларын тексеріңіз. HTTP таймауты төлем болмады дегенді уәде етпеңіз. Кез келген жаңа ақылы талпынысты айқын етіңіз және қос шерту жіберілімдерінің алдын алу үшін қолданбалық деңгейде сұрау құлпын пайдаланыңыз.

Жеке тұтынушы анықтама-суреттерін қабылдамас бұрын нені шолу керек?

Қолданбаңыз қандай активтерді қабылдай алатынын, жүктеушінің оларды пайдалануға құқығы бар-жоғын және қандай төменгі сервистер оларды алатынын шешіңіз. Құпиялыққа уәде бермес бұрын ағымдағы провайдер шарттарындағы сақталым, логтар, жою және рұқсат етілген пайдалануды қарап шығыңыз. Ортақ демонстрацияларда жеке немесе құпия анықтама материалдардан аулақ болыңыз. Сақтайтыныңызды минималдаңыз, жеке объектілерді пайдаланушы бойынша оқшаулаңыз және жүктемелер мен генерацияланған файлдар үшін мерзім аяқталуы мен жою жұмыс ағындарын анықтаңыз. Жеке қолданбалық сақтау бэкеті модель провайдерінің сақталым саясатын өздігінен сипаттамайды.

Бэкенд немесе видео провайдерін ауыстырсаң да жобаны қалай портативті ұстауға болады?

Интерфейсті қолданбаға тиесілі job схемасына тәуелді етіңіз, ал провайдерге тән сұрау өрістері мен күй картасын бөлек адаптердің ішінде ұстаңыз. Ішкі job ID-ны да, провайдердің task ID-нын да сақтаңыз және сұрауды қайта жасауға қажет активтерге сілтемелерді қалдырыңыз. Bolt-тың генерациялаған қолданба кодын және конфигурациясын нұсқа басқаруында сақтаңыз. Бэкендті ауыстырғанда, пайдаланушы және job жазбаларын көшіріңіз және трафикті ауыстырмай тұрып қолжетімділік шекараларын, қол қоюлы URL-мекенжайларын және тарихи жүктеп алуларды сынаңыз; код экспорттау бірден тірі дерекқорды немесе сақталған видео файлдарын ауыстырмайды.

Қорытынды

Bolt + CometAPI видео-генерация қолданбасы үшін практикалық негіз болып табылады: Bolt веб-қолданбаны жасауды жеделдетеді, ал CometAPI қолдау көрсетілетін видео модельдерге қолжетімділікті қамтамасыз етеді. Қауіпсіз text-to-video жұмыс ағынынан бастап, жұмыс өмірлік циклі мен биллинг бақылауларының жұмысын дәлелдеңіз, содан кейін сурет анықтамаларын, генерация тарихын, модель таңдауды және озық креативтік құралдарды қосыңыз. Фронтенд әрекеттерін ақылы сервер жақтағы инференстен бөлу қауіпсіз және сенімді өнім үшін аса маңызды.