返回作品集
kaloni.gr — 双语 Laravel 鞋履电商平台

kaloni.gr — 双语 Laravel 鞋履电商平台

我们为塞雷斯的女鞋品牌设计并开发了 kaloni.gr —— 一个双语(希腊语/英语)的 Laravel 12 电商平台。店面支持产品变体(尺码 + 颜色)、按颜色筛选的画廊、心愿单(访客使用 session,登录用户使用数据库并在登录时合并)、最近浏览商品、自动补全搜索和实时配送区域检测。支付采用网关无关的抽象设计(PaymentGatewayInterface 配合 DTO 结果),支持 Stripe 3DS、Cardlink 托管跳转(含 HMAC-SHA256 摘要验证)、银行转账、货到付款和到店付款。后台管理面板涵盖产品/变体/分类、优惠券、配送区域、订单生命周期和支付状态转换、评论审核、订阅邮件和到货通知、客户管理(含 GDPR 自助删除:匿名化 vs 硬删除)以及活动日志。双语内容使用专用的 *_translations 表,配合智能区域回退链(URL 前缀 → session → 用户偏好 → 配置),为 SEO 友好的 /el/ 和 /en/ URL 提供支持,每页都包含 hreflang 备用链接和 Organization/WebSite JSON-LD。图片通过 Intervention Image v3 提供响应式 <picture> srcsets 和 WebP 兄弟版本;内联脚本通过 Vite nonces 符合 CSP;GA4 电商追踪(view_item, add_to_cart, purchase)受 cookie 同意控制。业务逻辑隔离在 23 个 service 类中,为 API 就绪奠定基础。

技术栈

Laravel 12 PHP 8.3 Alpine.js Custom CSS (BEM) MySQL Intervention Image v3 Stripe (3DS) Cardlink Laravel Breeze + Google OAuth Multilingual (el/en) JSON-LD / SEO Responsive Design GA4 E-commerce Vite

挑战

构建一个多网关支付系统,既能干净地支持同步流程(货到付款、银行转账),也能支持异步跳转流程(Stripe 3DS、Cardlink HMAC),同时保持双语内容模型简洁,并在数百个产品变体中保持目录的快速响应。

解决方案

设计了一个使用 DTO 结果的 PaymentGatewayInterface,让每个网关都能接入同一套 API;使用专用的 *_translations 表配合回退链(URL 前缀 → session → 用户偏好 → 配置),让每个实体的翻译集中在一个地方;通过 Intervention Image v3 缓存响应式 WebP 兄弟版本,并通过带有明确尺寸的 <picture> srcset 标签提供,以防止 CLS。