在 v0 中打开

将你的注册库与 Open in v0 集成。

如果你的注册库通过 URL 托管并且可以公开访问，你可以通过 https://v0.dev/chat/api/open?url=[URL] 端点在 v0 中打开一个注册库 item。

例如：https://v0.dev/chat/api/open?url=https://ui.shadcn.com/r/styles/new-york/login-01.json

重要： Open in v0 不支持 cssVars、css、envVars、命名空间注册库或高级认证方式。

按钮

查看构建你自己的 Open in v0 按钮以了解如何构建你自己的 Open in v0 按钮。

下面是一个把 Open in v0 按钮添加到你网站中的简单示例。

import { Button } from "@/components/ui/button"
 
export function OpenInV0Button({ url }: { url: string }) {
  return (
    <Button
      aria-label="Open in v0"
      className="h-8 gap-1 rounded-[6px] bg-black px-3 text-xs text-white hover:bg-black hover:text-white dark:bg-white dark:text-black"
      asChild
    >
      <a
        href={`https://v0.dev/chat/api/open?url=${url}`}
        target="_blank"
        rel="noreferrer"
      >
        在 v0 中打开{" "}
        <svg
          viewBox="0 0 40 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className="h-5 w-5 text-current"
        >
          <path
            d="M23.3919 0H32.9188C36.7819 0 39.9136 3.13165 39.9136 6.99475V16.0805H36.0006V6.99475C36.0006 6.90167 35.9969 6.80925 35.9898 6.71766L26.4628 16.079C26.4949 16.08 26.5272 16.0805 26.5595 16.0805H36.0006V19.7762H26.5595C22.6964 19.7762 19.4788 16.6139 19.4788 12.7508V3.68923H23.3919V12.7508C23.3919 12.9253 23.4054 13.0977 23.4316 13.2668L33.1682 3.6995C33.0861 3.6927 33.003 3.68923 32.9188 3.68923H23.3919V0Z"
            fill="currentColor"
          ></path>
          <path
            d="M13.7688 19.0956L0 3.68759H5.53933L13.6231 12.7337V3.68759H17.7535V17.5746C17.7535 19.6705 15.1654 20.6584 13.7688 19.0956Z"
            fill="currentColor"
          ></path>
        </svg>
      </a>
    </Button>
  )
}

<OpenInV0Button url="https://example.com/r/hello-world.json" />

认证

Open in v0 只支持查询参数认证。它不支持命名空间注册库，也不支持诸如 Bearer token 或 headers 中的 API key 这类高级认证方式。

使用查询参数认证

如果你想为在 Open in v0 中使用的注册库添加认证，请使用 token 查询参数：

https://registry.company.com/r/hello-world.json?token=your_secure_token_here

在你的注册库服务器中实现时：

检查 token 查询参数
根据你的认证系统校验 token
如果 token 无效或缺失，返回 401 Unauthorized
shadcn CLI 和 Open in v0 都会处理这个 401 响应，并向用户显示合适的消息

Add a Registry registry.json

本页目录

按钮认证使用查询参数认证