PuppyIP 资源中心
跨境电商开发 5 分钟 发布于 2026-10-15

Hydrogen 2026-10 正式发布:保留现有框架,先看服务端与托管条件

Shopify 于 2026 年 10 月 14 日宣布 Hydrogen 2026-10 正式可用。它可以为现有项目加入 Shopify 商务能力,同时保留页面、路由和设计;前提是项目能运行服务端代码。只有浏览器代码或纯静态输出的应用不在支持范围内。

Shopify Hydrogen 无头店面 Oxygen

服务对象与地域限制

PuppyIP 仅面向海外合规企业及其授权人员提供服务,不面向中国大陆地区开放或提供代理服务。本服务仅限用于中国大陆境外的合法业务活动,严禁在中国大陆境内使用本服务。

代理 IP 或服务器位于境外,不改变上述限制。不得通过中转、转接、共享或转售向中国大陆境内的最终使用者提供本服务。使用前请阅读用户服务协议。

本文要点

  • Hydrogen 负责购物车、商品选项、搜索等商务能力,所选框架继续负责路由、数据加载和渲染。
  • 可以从 React Router 或 Next.js 模板起步,也可以接入现有服务端项目;Vercel Shop 的账户、分析和同意管理功能需要主动启用。
  • 官方明确 Oxygen 仍免费,但没有因此承诺 Shopify 套餐、支付或其他托管服务全部免费。
  • 现有 Hydrogen 店面继续工作,无需因版本发布立即重建;编码代理的技能也应与安装版本同步。

从整站框架变成库,省掉的是重新搭站

10 月 14 日的正式发布建立在 6 月开发者预览及随后七次发布之上。新 Hydrogen 是可用于不同 JavaScript 框架的库,不再要求项目整体采用旧 Hydrogen 的 React Router 框架结构。

购物车、商品变体、集合筛选、预测搜索、Markets 与买家货币、遵循用户同意设置的分析、Shop Pay 和客户账户等商务能力由 Hydrogen 提供。项目仍使用自己的框架处理路由、数据加载和渲染,也保留自己的设计;这不等于自动生成完整店面。

先核对服务端能力,再决定是否接入现有项目

官方入门文档要求应用能够运行服务端代码,并在请求交给应用路由器之前接入 Hydrogen 的请求处理。只在浏览器运行或只生成静态文件的应用不能直接采用这条接入路径。

现有项目可以继续使用自己的页面、组件和设计系统,官方列举了 Astro、Nuxt、SvelteKit 和 SolidStart 等示例。框架名称本身不是充分条件:例如,假设一个 Astro 项目只输出静态文件,仍要先解决服务端能力问题。

需要店面起点,可以先比较两种模板

从零开始时,可选 React Router 模板配合 Oxygen,或 Next.js 模板配合 Vercel Shop。两条路径使用相同的 Hydrogen 包,提供首页、集合页、商品页、搜索和购物车等起点,也允许以后迁移托管位置。

模板的结构和样式可以调整或移除。Vercel Shop 的客户账户、分析和同意管理功能需要主动启用,不应假设模板默认全开;React Router 模板在连接商店之前可以使用 mock.shop 演示数据。

让编码代理使用当前版本的技能

官方提供 npx @shopify/hydrogen@latest setup 作为设置入口,并随项目提供 20 项与版本匹配的编码代理技能。这些技能帮助代理组合和扩展已有商务能力,页面、品牌与结账相关决策仍需要开发者明确。

升级 Hydrogen 后,可按文档运行 npx @shopify/hydrogen skills sync,同步技能与包的版本。Hydrogen 没有附带 UI 组件库,现有组件或自行编写的界面仍由项目负责。

旧 Hydrogen 店面不需要立即重建

官方明确表示现有 Hydrogen 店面会继续工作,当前没有必须立即完成的操作。2026-10 是此次版本名称,不能据此推导出旧店面的强制迁移截止日期。

准备迁移时,可以使用官方迁移技能,保留页面和路由并替换商务代码的接入方式。实际项目仍应核对购物车、账户与分析等已有行为;这些核对属于迁移准备,并不意味着官方要求整站重写。

托管可选,免费范围要分别核对

官方表示应用可以部署到适合项目的托管环境,Oxygen 仍然免费;React Router 模板也可通过 Shopify 后台部署到 Oxygen。选择其他平台前,应确认它能运行应用所需的服务端代码及部署方式。

此次发布与入门文档没有给出完整的 Shopify 套餐、国家资格、Shop Pay 可用范围或第三方托管价目表。Oxygen 免费不能理解为开店、支付和所有托管资源都免费,具体选型还应核对所用服务自己的条件。

资料来源

常见问题

购物代理可以绕过买家确认直接下单吗?

不能从此次发布推导出这种授权。在支持 WebMCP 的浏览器中,代理可以搜索目录和更新购物车;Shopify Checkout 的 complete_checkout 工具是在买家确认后提交订单。官方没有将它描述为可绕过确认的自动扣款能力。

应用、界面和代理会使用同一套购物车规则吗?

Hydrogen 采用与 Liquid 主题相同的标准店面操作,使兼容的应用、界面和代理可以共享购物车约定。这是兼容性设计,不是对所有第三方应用已经完成验证的承诺。

使用 React Router 的旧项目必须改成 Next.js 吗?

不必。官方同时提供 React Router 与 Next.js 入门模板,并明确现有 Hydrogen 店面继续工作。选择框架时先核对服务端能力及现有项目需求,不需要仅因新模板出现而更换框架。