Shopify Liquid技术问询：购物车页面无法获取当前URL

核心问题分析 #

Shopify的{{ page.url }}在购物车页面（cart.liquid）和迷你购物车（mini-cart.liquid）中仅返回路径部分（如/cart），不包含完整域名与locale前缀；{{ shop.secure_url }}仅能获取店铺根域名，无法关联当前页面的locale和具体路径。你之前硬编码域名与locale的条件判断适配性差，且未覆盖全场景，导致问题未解决。

可行解决方案 #

方案1：用request.fullpath拼接完整URL #

Shopify的request对象中，fullpath属性会返回包含locale前缀和页面路径的完整相对路径（如/de/cart），结合{{ shop.secure_url }}可拼接出完整URL：

{% assign full_cart_url = shop.secure_url | append: request.fullpath %}

生成结账链接时可直接复用该逻辑，或更灵活调整：

{% assign checkout_path = request.fullpath | replace: '/cart', '/' | append: 'checkout' %}
<a href="{{ shop.secure_url }}{{ checkout_path }}">前往结账</a>

方案2：动态适配request.locale与request.origin #

无需硬编码域名，用request.origin获取当前访问的完整域名（如https://myshop.ch），结合request.locale.iso_code动态生成路径：

<a href="{{ request.origin }}/{{ request.locale.iso_code }}/checkout">前往结账</a>

该写法自动适配不同域名与locale，避免遗漏其他语言或域名场景。

方案3：AJAX加载的迷你购物车处理 #

若迷你购物车通过AJAX加载，request对象可能无法直接获取当前页面locale，可按以下步骤处理：

1. 在主题主文件（theme.liquid）中定义全局JS变量：

   <script>
     window.shopifyLocale = "{{ request.locale.iso_code }}";
     window.shopifyOrigin = "{{ request.origin }}";
   </script>
   

2. 在迷你购物车的JS逻辑中调用变量生成链接：

   const checkoutUrl = `${window.shopifyOrigin}/${window.shopifyLocale}/checkout`;
   document.querySelector('.checkout-btn').href = checkoutUrl;
   

验证要点 #

• 测试不同locale（如de、en）下的链接生成是否正确
• 确认多店铺域名场景下链接正常工作
• 确保迷你购物车无论静态还是AJAX加载，locale和域名均匹配当前访问页面

内容的提问来源于stack exchange，提问作者Seb