智能体已经在网上购物,但它们使用的往往是原本为人与搜索引擎构建的页面和工具。为智能体打造更好的购物体验,意味着要把它们当作一等购物者来对待,为它们提供可以直接读取的商品信息,以及专为智能体购物而设计的工具。
今天,Vercel Shop——我们面向 Shopify 的开源 Next.js 店面模板——正式开放使用。团队可以发布针对人、搜索引擎和智能体各自交互方式优化的店面。

Vercel Shop 基于 Shopify 的 Hydrogen SDK 构建。该 SDK 让团队能够访问商店的商品目录、购物车与订单管理、支付以及结账功能,从而构建自定义店面。今年早些时候,Vercel 与 Shopify 宣布计划重建 Hydrogen,使其能够跨 JavaScript 框架运行。今天,重建后的 SDK 正式开放使用。
结账功能极难做对。它是那种确实需要 20 年反复打磨的软件之一。而 Shopify 一直非常开放,所以我们邀请大家尽情地从我们的结账功能中取用各个部分进行改造。基本上,你可以拿走 Shopify 构建的全部基础设施,用它来构建任何你想要的东西。Tobias Lütke,Shopify 联合创始人兼首席执行官(CEO)
复制标题链接为智能体提供它们所需的信息和工具
Vercel Shop 将商品页面以机器可读内容的形式提供,包括价格、库存情况和选项。同一个商品 URL 既可以向人提供可视化页面,也可以提供智能体无需解读页面布局即可读取的商品信息。该模板还在页面和站点地图中嵌入了结构化数据,以帮助搜索和问答引擎发现并理解这些商品。
Shopify 联合开发了通用商务协议(UCP),为智能体提供了一种标准方式,用于搜索商店目录、读取商品详情、查询库存、构建购物车并获取结账链接。Vercel Shop 让这些能力可在商家自己的域名下被发现,因此智能体可以使用 MCP 搜索商品并构建购物车,而无需浏览网站。
复制标题链接为所有客户定制体验
Vercel Shop 将商店的商品目录、购物车和结账功能与 Next.js 店面、面向智能体的商品信息和购物工具,以及由 eve 驱动的购物助手整合在一起。店面与助手位于同一代码库中,因此团队可以自定义商店的设计以及助手帮助购物者的方式。
模板中包含的技能 指导编码代理完成设置、自定义和模板更新。团队可以打造一种体验,让购物者浏览产品页面,或让助手查找产品并将其加入购物车。两者共享同一个购物车,因此购物者在不同体验之间切换时,会保留已添加的商品。
你可以使用 Vercel Shop 构建高度自定义、设计精良、面向代理的体验。它运行在 Next.js 上,构建于 Shopify 之上,而且快得惊人。Guillermo Rauch 创始人兼 CEO @ Vercel
复制标题链接使用 Shopify 和 Vercel 构建的店面
今天,我们在 vercel.store 上线了我们的周边商品商店,推出限量版发售。它构建于 Vercel Shop 之上。该商店的购物代理帮助购物者查找产品、将其加入购物车,并继续结账。
Shopify、Next.js 和 Vercel 已经为包括 AG1、Bombas 和 PAIGE 在内的品牌提供店面支持。当 PAIGE 重新架构其电商平台时,它在黑色星期五和网络星期一期间实现了收入增长 22%、转化率提升 76%,且没有停机。
复制标题链接开始使用 Vercel Shop
创建一个店面:
pnpm create next-app@latest my-store --example https://github.com/vercel/shop
开始使用 Vercel Shop。查看文档以连接你的 Shopify 商店并配置店面。
