在没有内联脚本的情况下在 Shopify Checkout 页面上按地理位置隐藏元素？

Posted 2023-02-23

【中文标题】在没有内联脚本的情况下在 Shopify Checkout 页面上按地理位置隐藏元素？

【英文标题】：Hiding an element by geolocation on Shopify Checkout page without inline script?

【发布时间】：2020-12-21 16:49:43

【问题描述】：

我正在尝试使用对 IPstack 的 API 调用来隐藏来自日本 (JP) 的客户的快速付款选项。它在通过浏览器堆栈进行测试时工作了几次，但现在我的 api 调用收到以下 consolve log 错误，因为它违反了以下内容安全策略指令：“script-src 'self' 'unsafe-inline' 'unsafe-eval ' blob: cdn.shopify.com cdn.shopifycdn.net cdn.shopifycloud.com app.shopify.com'。有谁知道在 shopify checkout.liquid 页面上按地理位置隐藏元素的其他方法？

<div class ="alt-payments"> alternative_payment_methods </div>
            <script>
              jQuery.ajax(
                url: 'https://api.ipstack.com/check?access_key=API_ACCESS_KEY&fields=country_code',
                dataType: 'jsonp',
                success: function(location) 
                    // If the visitor is browsing from JP.
                    if (location.country_code === 'JP') 
                    // display none express payments.
                    jQuery('.alt-payments').css('display','none');
                    
                
                 );
            </script>

【问题讨论】：

商店是 Shopify plus 还是任何将结帐页面访问到 Shopify 的自定义或第 3 方？

商店是 shopify plus - 我正在尝试使用对 IPstack 的 API 调用的结果来返回客户国家代码的值以检查条件 JP 并使用 jquery 隐藏快递结帐付款方式显示没有任何条件为真。

我认为 Shopify 加上您在之前的步骤（例如地址或运输详细信息）上基于国家/地区开发逻辑，不需要依赖 3rd 方请求？

使用地址国家/地区的 shopify 变量无法作为解决方案，因为我们需要在客户开始将其地址输入常规结帐字段之前隐藏快速付款方式。我们不允许任何来自日本的客户使用在输入运输信息之前选择的快速结帐方式。

您需要检查主页或集合或任何其他页面上的位置并将值保存到本地存储并在结帐页面上使用它，因为安全问题 Shopify 可能不允许任何第三在结帐页面上聚会。

【参考方案1】：

我会使用 Shopify 脚本，因为您使用的是 Plus。无论如何，发货后付款。所以你有付款前的地址。除非你真的在做一些奇怪的事情。普通的 Plus 结账只会检查地址，然后使用脚本隐藏您不喜欢的付款方式。这就是 Plus 的重点。

【讨论】：

David 就是这种情况，除了在客户将其地址输入到常规 shopify 结帐流程之前提供快速结帐方法。问题是选择使用快递方式（例如 ApplePay 或 Paypal）结账的客户可以输入无法通过 Shopify Checkout API 验证的送货地址，因为这些是独立托管的第三方结账，因此我们的亚太地区选择快递方式（Paypal 或 ApplePay）的客户可以为其送货地址输入无效的非拉丁字符，并且无法发货。

对我来说毫无意义。使用 Apple Pay 或 Paypal 的全部意义在于，您无需提供您的地址。如果除了按一个按钮之外我必须实际做任何事情，Express 付款中没有 Express。听起来你的问题比我想象的要深......很难而且太糟糕了！