Spree Next.js 商店前端如何开启 B2B 批发门户并配置渠道门控模式【免费下载链接】spreeOpen Source eCommerce Platform for B2B, Marketplace, and Enterprise. REST API, TypeScript SDK, and production-ready Next.js storefront. Self-host it. Own your stack. No vendor lock-in. Zero platform fees.项目地址: https://gitcode.com/GitHub_Trending/sp/spreeSpree 的 Next.js 商店前端内置了一个可选的 B2B 批发门户/wholesale路由。它运行在一条单独的 Spree 销售渠道上与面向公众的 DTC 商店共用同一套前端和 Spree 后端一次部署即可同时服务零售访客和登录后可见批发价的贸易买家。本文以「已经跑通 Next.js 商店前端 Spree 后端」为前提说明如何打开这个批发门户以及如何切换渠道的门控gating模式。前提渠道是端点门控的根源批发门户本身不保存任何门控状态全部访问控制由渠道的storefront_access属性决定。每个 Store API 请求都会解析到一条渠道如果请求头携带X-Spree-Channel则按channels.code或ch_…前缀 ID匹配当前 store 下的渠道否则回退到 store 的默认渠道。渠道解析后其storefront_access决定了未登录访客能看到什么这个限制由Store API 强制前端无法放宽它。storefront_access有三种取值渠道未设置时继承所属 Store 的值两者都未设置时最终落到public模式访客看目录访客看价格访客可下单login_required否 — 读取直接返回401展示登录墙否否prices_hidden是 — 只读浏览否 — 金额字段返回null前端渲染为「sign in for pricing」否 —「sign in to order」public是是是受guest_checkout控制批发门户支持前两种门控模式public是 DTC 开放渠道的姿态批发渠道通常不用。渠道上的guest_checkout无账户能否下单独立于storefront_access解析两者分开设置。如果还没有批发渠道在管理后台Settings → Sales channels里新建一条渠道并记下它的code保存时会自动归一化为 URL 安全的 slug留空则从name派生。后端种子数据默认会装一条login_required的批发渠道code 为wholesale直接复用即可。第一步为批发渠道设置门控模式修改渠道的storefront_access即可在两种门控模式之间切换。用 Admin SDK需要 secret keysk_xxx// 登录墙模式访客完全不可见批发目录 await adminClient.channels.update(ch_wholesale, { storefront_access: login_required, guest_checkout: false, }) // 切换为 prices_hidden访客可浏览目录但看不到价格 await adminClient.channels.update(ch_wholesale, { storefront_access: prices_hidden, }) // 将渠道值清空继承 store 级默认 await adminClient.channels.update(ch_wholesale, { storefront_access: null, })对应 HTTP 请求ch_wholesale换成你的渠道 IDcurl -X PATCH https://api.mystore.com/api/v3/admin/channels/ch_wholesale \ -H X-Spree-API-Key: sk_xxx \ -H Content-Type: application/json \ -d { storefront_access: login_required, guest_checkout: false }切换模式即时生效姿态是按请求解析的不需要预热缓存也不需要重新部署前端。两种模式下登录和注册走的都是同一套审批流程。Store API 请求时的渠道解析与 storefront_access 门控第二步在商店前端开启批发门户批发门户是默认关闭的 opt-in 插件不配置时商店只做 DTC — 批发导航链接、页脚链接、首页分区全部隐藏所有/wholesale路由返回 404。开启只需一个环境变量。商店前端的配置写在.env.local从.env.example复制起步# .env.local —— 批发门户环境变量 SPREE_API_URLhttps://api.mystore.com # 必需已有的 Spree API 端点 SPREE_PUBLISHABLE_KEYpk_xxx # 必需已有的 publishable key SPREE_WHOLESALE_CHANNELwholesale # 开启开关指向后端批发渠道的 code # SPREE_WHOLESALE_PUBLISHABLE_KEYpk_xxx # 可选见下SPREE_WHOLESALE_CHANNEL开启开关。设为后端某条已门控渠道的 code如上例的wholesale。没有默认值未设置时批发 UI 全部不渲染/wholesale路由 404。SPREE_WHOLESALE_PUBLISHABLE_KEY可选。渠道头本身就能选中渠道所以它回退到SPREE_PUBLISHABLE_KEY只有当你想把批发面绑定到渠道级 publishable key 时才需要设置。后端渠道的 code 必须与SPREE_WHOLESALE_CHANNEL的值一致。如果脚手架时用了create-spree-app的 sample-data 模板它会自动把SPREE_WHOLESALE_CHANNELwholesale写进商店.env.local并使用默认 publishable key 运行门户——不需要额外 key 或后端改动。门户的工作机制是「surface」批发 surface 持有自己绑定的 SDK 客户端每个请求都带X-Spree-Channel: wholesale头import { createClient } from spree/sdk const wholesaleClient createClient({ baseUrl: process.env.SPREE_API_URL, publishableKey: process.env.SPREE_PUBLISHABLE_KEY, channel: wholesale, // sent as X-Spree-Channel on every request })因为每个 surface 有自己的客户端、购物车 cookie 和缓存键同一个客户可以同时持有一个开放的 DTC 购物车和一个批发购物车而互不串扰JWT 会话是共享的——购物车分开登录态从不分开。第三步买家审批 —— 登录不等于可用渠道门控只管「访客能看到多少」还有一道独立的客户级检查买家必须被批准才能享受贸易价。批准 加入Wholesale客户组管理员把申请者加进这个组即完成审批。前端读取customers/me的customer_groups后分三种状态渲染访客—login_required下看到登录/申请墙prices_hidden下看到只读目录 价格提示。已登录但不在组内— 显示「申请审核中」状态。两种模式下已认证但未批准的买家都无法按批发价交易。已登录且在组内— 看到完整门户贸易目录、快速下单、批发购物车。在管理后台把客户加入客户组的操作路径Customers → Customer Groups → 目标组 → Add Customers在侧边面板中搜索并选中客户点击Add Selected移除则勾选客户后点Remove from Group。贸易价按数量解锁种子模型中单行达到 10 件同款商品时才给贸易价VolumeRule 按行项目匹配不按整单。该数量规则挂在后端的 Price List 上前端只展示 API 对达标数量返回的批发价未达标时回落到零售价不会硬性阻断下单。验证确认门控与审批生效配置完成后可以按下面逐项核对全部基于 Store API 的公开行为门户是否已开启带渠道头访问批发目录不再 404且返回的是批发渠道的目录不带该头则命中默认渠道。curl https://api.mystore.com/api/v3/store/products \ -H X-Spree-API-Key: pk_xxx \ -H X-Spree-Channel: wholesalelogin_required模式未携带认证信息的未登录请求对受保护读接口一律返回401认证、密码重置、国家/币种等参考数据接口除外。此时前端在受保护页面展示登录/申请墙。prices_hidden模式未登录请求读取成功但所有金额字段序列化为null。curl https://api.mystore.com/api/v3/store/products \ -H X-Spree-API-Key: pk_xxx \ -H X-Spree-Channel: wholesale # 响应中 price 相关字段应为 null审批链路用一个已登录但不在 Wholesale 组的账号访问门户应看到「申请审核中」而非批发价管理员将其加入 Wholesale 组后同一账号即可看到贸易目录。前端依据的就是customers/me返回的customer_groups。贸易价用已批准的买家账号把某商品行数量加到 10 件种子模型阈值API 返回的价格切换到批发价低于阈值则回落到零售价。想直接跑通完整演示已批准买家 带数量规则的批发 Price List可以加载示例数据bin/rake spree:load_sample_data它会创建一个演示买家wholesaleexample.com密码spree123并加入 Wholesale 组同时建立名为Wholesale的 Price List带 10 件起购的 VolumeRule 和指向 Wholesale 组的 CustomerGroupRule贸易价为该货币零售价打六折40% off且按变体 × 币种覆盖全目录。注意这是演示种子数据生产环境请按自己的定价规则建 Price List在 Admin Panel 的Products → Price Lists或经 Admin API 创建。边界与限制渠道门控由 Store API 强制执行商店前端无法放宽它切换模式即时生效无需重新部署前端。guest_checkout与storefront_access是两个独立开关一条public渠道也可以要求账户下单。登录从不跳过审批已认证但未入组的买家在两种门控模式下都不能按批发价交易。批发渠道通常不应使用public姿态。门户是参考实现而非固定功能同一套渠道 surface 门控构件也可以反过来把主 DTC 渠道门控起来members-only 商店或去掉公开目录只做登录优先的 B2B 商店按 Wholesale Portal 中的模式自行改造。进一步阅读Channels — Storefront Access Gating、Stores — storefront access defaults、Pricing — Price Lists 与 Volume Rule、Store SDK: ConfigurationsetChannel与 channel 客户端选项。【免费下载链接】spreeOpen Source eCommerce Platform for B2B, Marketplace, and Enterprise. REST API, TypeScript SDK, and production-ready Next.js storefront. Self-host it. Own your stack. No vendor lock-in. Zero platform fees.项目地址: https://gitcode.com/GitHub_Trending/sp/spree创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Spree Next.js 商店前端如何开启 B2B 批发门户并配置渠道门控模式？
Spree Next.js 商店前端如何开启 B2B 批发门户并配置渠道门控模式【免费下载链接】spreeOpen Source eCommerce Platform for B2B, Marketplace, and Enterprise. REST API, TypeScript SDK, and production-ready Next.js storefront. Self-host it. Own your stack. No vendor lock-in. Zero platform fees.项目地址: https://gitcode.com/GitHub_Trending/sp/spreeSpree 的 Next.js 商店前端内置了一个可选的 B2B 批发门户/wholesale路由。它运行在一条单独的 Spree 销售渠道上与面向公众的 DTC 商店共用同一套前端和 Spree 后端一次部署即可同时服务零售访客和登录后可见批发价的贸易买家。本文以「已经跑通 Next.js 商店前端 Spree 后端」为前提说明如何打开这个批发门户以及如何切换渠道的门控gating模式。前提渠道是端点门控的根源批发门户本身不保存任何门控状态全部访问控制由渠道的storefront_access属性决定。每个 Store API 请求都会解析到一条渠道如果请求头携带X-Spree-Channel则按channels.code或ch_…前缀 ID匹配当前 store 下的渠道否则回退到 store 的默认渠道。渠道解析后其storefront_access决定了未登录访客能看到什么这个限制由Store API 强制前端无法放宽它。storefront_access有三种取值渠道未设置时继承所属 Store 的值两者都未设置时最终落到public模式访客看目录访客看价格访客可下单login_required否 — 读取直接返回401展示登录墙否否prices_hidden是 — 只读浏览否 — 金额字段返回null前端渲染为「sign in for pricing」否 —「sign in to order」public是是是受guest_checkout控制批发门户支持前两种门控模式public是 DTC 开放渠道的姿态批发渠道通常不用。渠道上的guest_checkout无账户能否下单独立于storefront_access解析两者分开设置。如果还没有批发渠道在管理后台Settings → Sales channels里新建一条渠道并记下它的code保存时会自动归一化为 URL 安全的 slug留空则从name派生。后端种子数据默认会装一条login_required的批发渠道code 为wholesale直接复用即可。第一步为批发渠道设置门控模式修改渠道的storefront_access即可在两种门控模式之间切换。用 Admin SDK需要 secret keysk_xxx// 登录墙模式访客完全不可见批发目录 await adminClient.channels.update(ch_wholesale, { storefront_access: login_required, guest_checkout: false, }) // 切换为 prices_hidden访客可浏览目录但看不到价格 await adminClient.channels.update(ch_wholesale, { storefront_access: prices_hidden, }) // 将渠道值清空继承 store 级默认 await adminClient.channels.update(ch_wholesale, { storefront_access: null, })对应 HTTP 请求ch_wholesale换成你的渠道 IDcurl -X PATCH https://api.mystore.com/api/v3/admin/channels/ch_wholesale \ -H X-Spree-API-Key: sk_xxx \ -H Content-Type: application/json \ -d { storefront_access: login_required, guest_checkout: false }切换模式即时生效姿态是按请求解析的不需要预热缓存也不需要重新部署前端。两种模式下登录和注册走的都是同一套审批流程。Store API 请求时的渠道解析与 storefront_access 门控第二步在商店前端开启批发门户批发门户是默认关闭的 opt-in 插件不配置时商店只做 DTC — 批发导航链接、页脚链接、首页分区全部隐藏所有/wholesale路由返回 404。开启只需一个环境变量。商店前端的配置写在.env.local从.env.example复制起步# .env.local —— 批发门户环境变量 SPREE_API_URLhttps://api.mystore.com # 必需已有的 Spree API 端点 SPREE_PUBLISHABLE_KEYpk_xxx # 必需已有的 publishable key SPREE_WHOLESALE_CHANNELwholesale # 开启开关指向后端批发渠道的 code # SPREE_WHOLESALE_PUBLISHABLE_KEYpk_xxx # 可选见下SPREE_WHOLESALE_CHANNEL开启开关。设为后端某条已门控渠道的 code如上例的wholesale。没有默认值未设置时批发 UI 全部不渲染/wholesale路由 404。SPREE_WHOLESALE_PUBLISHABLE_KEY可选。渠道头本身就能选中渠道所以它回退到SPREE_PUBLISHABLE_KEY只有当你想把批发面绑定到渠道级 publishable key 时才需要设置。后端渠道的 code 必须与SPREE_WHOLESALE_CHANNEL的值一致。如果脚手架时用了create-spree-app的 sample-data 模板它会自动把SPREE_WHOLESALE_CHANNELwholesale写进商店.env.local并使用默认 publishable key 运行门户——不需要额外 key 或后端改动。门户的工作机制是「surface」批发 surface 持有自己绑定的 SDK 客户端每个请求都带X-Spree-Channel: wholesale头import { createClient } from spree/sdk const wholesaleClient createClient({ baseUrl: process.env.SPREE_API_URL, publishableKey: process.env.SPREE_PUBLISHABLE_KEY, channel: wholesale, // sent as X-Spree-Channel on every request })因为每个 surface 有自己的客户端、购物车 cookie 和缓存键同一个客户可以同时持有一个开放的 DTC 购物车和一个批发购物车而互不串扰JWT 会话是共享的——购物车分开登录态从不分开。第三步买家审批 —— 登录不等于可用渠道门控只管「访客能看到多少」还有一道独立的客户级检查买家必须被批准才能享受贸易价。批准 加入Wholesale客户组管理员把申请者加进这个组即完成审批。前端读取customers/me的customer_groups后分三种状态渲染访客—login_required下看到登录/申请墙prices_hidden下看到只读目录 价格提示。已登录但不在组内— 显示「申请审核中」状态。两种模式下已认证但未批准的买家都无法按批发价交易。已登录且在组内— 看到完整门户贸易目录、快速下单、批发购物车。在管理后台把客户加入客户组的操作路径Customers → Customer Groups → 目标组 → Add Customers在侧边面板中搜索并选中客户点击Add Selected移除则勾选客户后点Remove from Group。贸易价按数量解锁种子模型中单行达到 10 件同款商品时才给贸易价VolumeRule 按行项目匹配不按整单。该数量规则挂在后端的 Price List 上前端只展示 API 对达标数量返回的批发价未达标时回落到零售价不会硬性阻断下单。验证确认门控与审批生效配置完成后可以按下面逐项核对全部基于 Store API 的公开行为门户是否已开启带渠道头访问批发目录不再 404且返回的是批发渠道的目录不带该头则命中默认渠道。curl https://api.mystore.com/api/v3/store/products \ -H X-Spree-API-Key: pk_xxx \ -H X-Spree-Channel: wholesalelogin_required模式未携带认证信息的未登录请求对受保护读接口一律返回401认证、密码重置、国家/币种等参考数据接口除外。此时前端在受保护页面展示登录/申请墙。prices_hidden模式未登录请求读取成功但所有金额字段序列化为null。curl https://api.mystore.com/api/v3/store/products \ -H X-Spree-API-Key: pk_xxx \ -H X-Spree-Channel: wholesale # 响应中 price 相关字段应为 null审批链路用一个已登录但不在 Wholesale 组的账号访问门户应看到「申请审核中」而非批发价管理员将其加入 Wholesale 组后同一账号即可看到贸易目录。前端依据的就是customers/me返回的customer_groups。贸易价用已批准的买家账号把某商品行数量加到 10 件种子模型阈值API 返回的价格切换到批发价低于阈值则回落到零售价。想直接跑通完整演示已批准买家 带数量规则的批发 Price List可以加载示例数据bin/rake spree:load_sample_data它会创建一个演示买家wholesaleexample.com密码spree123并加入 Wholesale 组同时建立名为Wholesale的 Price List带 10 件起购的 VolumeRule 和指向 Wholesale 组的 CustomerGroupRule贸易价为该货币零售价打六折40% off且按变体 × 币种覆盖全目录。注意这是演示种子数据生产环境请按自己的定价规则建 Price List在 Admin Panel 的Products → Price Lists或经 Admin API 创建。边界与限制渠道门控由 Store API 强制执行商店前端无法放宽它切换模式即时生效无需重新部署前端。guest_checkout与storefront_access是两个独立开关一条public渠道也可以要求账户下单。登录从不跳过审批已认证但未入组的买家在两种门控模式下都不能按批发价交易。批发渠道通常不应使用public姿态。门户是参考实现而非固定功能同一套渠道 surface 门控构件也可以反过来把主 DTC 渠道门控起来members-only 商店或去掉公开目录只做登录优先的 B2B 商店按 Wholesale Portal 中的模式自行改造。进一步阅读Channels — Storefront Access Gating、Stores — storefront access defaults、Pricing — Price Lists 与 Volume Rule、Store SDK: ConfigurationsetChannel与 channel 客户端选项。【免费下载链接】spreeOpen Source eCommerce Platform for B2B, Marketplace, and Enterprise. REST API, TypeScript SDK, and production-ready Next.js storefront. Self-host it. Own your stack. No vendor lock-in. Zero platform fees.项目地址: https://gitcode.com/GitHub_Trending/sp/spree创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考