V0-sdk not working. returning iframe url returns a 404

Help
1

on “v0-sdk”: “^0.0.9”

i generate an iframe url using code below. however, the iframe url generated always returns a 404. example: iframe link

can someone please assist?

    // Create a chat using the v0 SDK
    const chatResponse = await v0.chats.create({
      message: `Create a mobile app UI with React Native/React that looks native. ${prompt}. Make it mobile-first, touch-friendly, with proper spacing for mobile devices.`,
      system:
        "You are an expert mobile app developer specializing in React Native and mobile UI/UX design. Create beautiful, native-looking mobile interfaces.",
      chatPrivacy: "public",
      modelConfiguration: {
        modelId: "v0-1.5-md",
        imageGenerations: false,
      },
    });

    console.log("chatResponse xxx", chatResponse);

    // Get the full chat details to access messages
    const chat = await v0.chats.getById({ chatId: chatResponse.id });

    console.log("chat xxx", chat);

    // Get the latest version ID from the chat
    const latestMessage = chat.messages[chat.messages.length - 1];
    const versionId = latestMessage.id;

    // Get the iframe URL for live preview
    const iframe = await v0.chats.findIframe({
      chatId: chat.id,
      versionId: versionId,
    });

    console.log("iframe xxx", iframe);
2

There’s another community post with 404 debugging tips that might be helpful. Please give these solutions a try and let us know how it goes.

A human should be around soon to offer more advice. But you can also get helpful information quickly by asking v0.

5

this is completely unrelated to vercel deployments. im trying to use v0-sdk iframe url result in my app

6

@andriy-kulak Thank you for reporting this issue. The SDK has been updated to show the correct usage:

import { v0 } from 'v0-sdk'

// Create a new chat
const chat = await v0.chats.create({
  message: 'Create a responsive navbar with Tailwind CSS',
  system: 'You are an expert React developer',
})
console.log(`Chat created: ${chat.url}`)

// Preview generated code
console.log(`Preview URL: ${chat.demo}`)

// Use in your application
const previewHtml = `<iframe src="${chat.demo}" width="100%" height="600px"></iframe>`

Please give this a try. Thank you!

2 Likes