如何从 Shopify 中具有自定义值的替代购物车模板获取信息？
How can I get information from an alternative cart template with custom values in Shopify?
我已经通过product.json推导出了我需要的值，但在我看来，这是最糟糕的选择。因为客户端需要处理很多不必要的信息。此外，对于每一个新产品或选项，要求都在增加。实际上，这是执行此功能的脚本部分：
var CompareTotal = 0;
$.each(cart.items, function(index, cartItem) {
var varID = cartItem.variant_id;
var comparePrice= '';
var TotalcomparePrice = '';
$.ajax({
url: '/products/' + cartItem.handle + '.js',
dataType: 'json',
async: false,
success: function(product){
product.variants.forEach(function(variant) {
if ( variant.id == varID && variant.compare_at_price !== 0){
comparePrice = variant.compare_at_price;
TotalcomparePrice = cartItem.quantity * comparePrice;
CompareTotal = CompareTotal + TotalcomparePrice;
return false;
}
});
}
});});
为了改进和加快这些流程，我创建了一个包含我需要的值的替代购物车模板。现在，任务是通过替换以前的方法来推导这些值。由于我无法使用 dataType: 'JSON'，因此情况变得复杂，因为默认数据将从服务器端返回。这是备用模板的样子：
{ "token": "eacf539f884b717a2a74ac775b9b8923", "note": "", "attributes": {}, "original_total_price": 2390, "total_price": 2390, "total_discount": 0, "total_weight": 0.0, "item_count": 2, "items": [{ "id": 31286186180719, "properties": { }, "quantity": 2, "variant_id": 31286186180719, "key": "31286186180719:404d70730b155abbf5e62b28445537ae", "title": "RO - 1. Darkest Brown \u0026amp; Dark Auburn Mix", "compare_at_price": 1595, "compare_line_price": 3190, "price": 1195, "original_price": 1195, "discounted_price": 2390, "line_price": 2390, "original_line_price": 2390, "total_discount": 0, "discounts": [], "sku": "31593080-233", "grams": 0, "vendor": "Newellar", "taxable": true, "product_id": 4380382494831, "gift_card": false, "url": "\/products\/ro?variant=31286186180719", "image": "\/1.jpg?v=1584483449", "handle": "royal-messy-hair-bun", "requires_shipping": true, "product_type": "", "product_title": "RO", "variant_title": "1. Darkest Brown \u0026 Dark Auburn Mix", "variant_options": ["1. Darkest Brown \u0026 Dark Auburn Mix"] } ], "total_compare_price": 3190, "currency": "EUR", "items_subtotal_price": 2390, "cart_level_discount_applications": [] }
我设法做的最后一件事是执行请求并在控制台日志中获取所有必要的信息。事情是这样的：
$.ajax({
type: 'GET',
url: '/cart?view=data',
success: function(response) {
json_response = JSON.parse(response);
console.log( 'response', json_response );
},
error: function(status) {
console.warn( 'ERROR', status );
}});
还需要为每个产品获取 compare_line_price 的值，为购物车获取 total_compare_price 的值。然后，使用把手，我可以显示它们。不幸的是，我没有从中学到任何东西，我是自学成才的，所以朝这个方向迈出的每一步都很困难。我希望有人能告诉我下一步该怎么做。
{%- layout none -%}
{%- assign cartJson = cart | json -%}
{%- assign cartToken = cartJson | split:'token":"' | last | split:'"' | first | json -%}
{% assign total_cart_compare_price = 0 %}
{
"token": {{ cartToken }},
"note": {{ cart.note | json }},
"attributes": {{ cart.attributes | json }},
"original_total_price": {{ cart.original_total_price | json }},
"total_price": {{ cart.total_price | json }},
"total_discount": {{ cart.total_discount | json }},
"total_weight": {{ cart.total_weight | json }},
"item_count": {{ cart.item_count | json }},
"items": [
{%- for item in cart.items -%}
{
"id": {{ item.id | json }},
"properties": {
{%- for prop in item.properties -%}
{{ prop | first | json }}:{{ prop | last | json }}{% unless forloop.last %},{% endunless %}
{%- endfor %}
},
"quantity": {{ item.quantity | json }},
"variant_id": {{ item.variant_id | json }},
"key": {{ item.key | json }},
"title": {{ item.title | json }},
"compare_at_price": {{ item.variant.compare_at_price | json }},
"compare_line_price": {{ item.variant.compare_at_price | times: item.quantity | json }},
"price": {{ item.price | json }},
"original_price": {{ item.original_price | json }},
"discounted_price": {{ item.line_price | json }},
"line_price": {{ item.line_price | json }},
"original_line_price": {{ item.original_line_price | json }},
"total_discount": {{ item.total_discount | json }},
"discounts": {{ item.discounts | json }},
"sku": {{ item.sku | json }},
"grams": {{ item.grams | json }},
"vendor": {{ item.vendor | json }},
"taxable": {{ item.taxable | json }},
"product_id": {{ item.product_id | json }},
"gift_card": {{ item.gift_card | json }},
"url": {{ item.url | json }},
"image": {{ item.variant.image | json }},
"handle": {{ item.product.handle | json }},
"requires_shipping": {{ item.requires_shipping | json }},
"product_type": {{ item.product.type | json }},
"product_title": {{ item.product.title | json }},
"variant_title": {{ item.variant.title | json }},
"variant_options": {{ item.variant.options | json }}
}{% unless forloop.last %},{% endunless %}
{% assign compare_price = item.variant.compare_at_price | times: item.quantity %}
{% assign total_cart_compare_price = total_cart_compare_price | plus: compare_price %}
{%- endfor -%}
],
"total_compare_price": {{ total_cart_compare_price | json }},
"currency": {{ cart.currency.iso_code | json }},
"items_subtotal_price": {{ cart.items_subtotal_price | json }},
"cart_level_discount_applications": {{ cart.cart_level_discount_applications | json }}
}
替代购物车模板如下所示。
将您的购物车液体更新为以下内容：
{%- layout none -%}
{%- assign cartJson = cart | json -%}
{%- assign cartToken = cartJson | split:'token":"' | last | split:'"' | first | json -%}
{% assign total_cart_compare_price = 0 %}
{
"token": {{ cartToken }},
"note": {{ cart.note | json }},
"attributes": {{ cart.attributes | json }},
"original_total_price": {{ cart.original_total_price | json }},
"total_price": {{ cart.total_price | json }},
"total_discount": {{ cart.total_discount | json }},
"total_weight": {{ cart.total_weight | json }},
"item_count": {{ cart.item_count | json }},
"items": [
{%- for item in cart.items -%}
{
"id": {{ item.id | json }},
"properties": {
{%- for prop in item.properties -%}
{{ prop | first | json }}:{{ prop | last | json }}{% unless forloop.last %},{% endunless %}
{%- endfor %}
},
"quantity": {{ item.quantity | json }},
"variant_id": {{ item.variant_id | json }},
"key": {{ item.key | json }},
"title": {{ item.title | json }},
"compare_at_price": {{ item.variant.compare_at_price | json }},
"compare_line_price": {{ item.variant.compare_at_price | times: item.quantity | json }},
"price": {{ item.price | json }},
"original_price": {{ item.original_price | json }},
"discounted_price": {{ item.line_price | json }},
"line_price": {{ item.line_price | json }},
"original_line_price": {{ item.original_line_price | json }},
"total_discount": {{ item.total_discount | json }},
"discounts": {{ item.discounts | json }},
"sku": {{ item.sku | json }},
"grams": {{ item.grams | json }},
"vendor": {{ item.vendor | json }},
"taxable": {{ item.taxable | json }},
"product_id": {{ item.product_id | json }},
"gift_card": {{ item.gift_card | json }},
"url": {{ item.url | json }},
"image": {{ item.variant.image | json }},
"handle": {{ item.product.handle | json }},
"requires_shipping": {{ item.requires_shipping | json }},
"product_type": {{ item.product.type | json }},
"product_title": {{ item.product.title | json }},
"variant_title": {{ item.variant.title | json }},
"variant_options": {{ item.variant.options | json }}
}{% unless forloop.last %},{% endunless %}
{%- if item.variant.compare_at_price != blank -%}
{%- assign compare_price = item.variant.compare_at_price | times: item.quantity -%}
{%- else -%}
{%- assign compare_price = item.line_price -%}
{%- endif -%}
{% assign total_cart_compare_price = total_cart_compare_price | plus: compare_price %}
{%- endfor -%}
],
"total_compare_price": {{ total_cart_compare_price | json }},
"currency": {{ cart.currency.iso_code | json }},
"items_subtotal_price": {{ cart.items_subtotal_price | json }},
"cart_level_discount_applications": {{ cart.cart_level_discount_applications | json }}
}
然后尝试使用下面的AJAX请求：
$.ajax({
type: 'GET',
url: '/cart?view=data',
success: function(response) {
json_response = JSON.parse(response);
console.log( 'response', json_response );
// Here's your total compare price
console.log( 'total_compare_at_price', json_response.total_compare_price );
},
error: function(status) {
console.warn( 'ERROR', status );
}
});
我已经通过product.json推导出了我需要的值，但在我看来，这是最糟糕的选择。因为客户端需要处理很多不必要的信息。此外，对于每一个新产品或选项，要求都在增加。实际上，这是执行此功能的脚本部分：
var CompareTotal = 0;
$.each(cart.items, function(index, cartItem) {
var varID = cartItem.variant_id;
var comparePrice= '';
var TotalcomparePrice = '';
$.ajax({
url: '/products/' + cartItem.handle + '.js',
dataType: 'json',
async: false,
success: function(product){
product.variants.forEach(function(variant) {
if ( variant.id == varID && variant.compare_at_price !== 0){
comparePrice = variant.compare_at_price;
TotalcomparePrice = cartItem.quantity * comparePrice;
CompareTotal = CompareTotal + TotalcomparePrice;
return false;
}
});
}
});});
为了改进和加快这些流程，我创建了一个包含我需要的值的替代购物车模板。现在，任务是通过替换以前的方法来推导这些值。由于我无法使用 dataType: 'JSON'，因此情况变得复杂，因为默认数据将从服务器端返回。这是备用模板的样子：
{ "token": "eacf539f884b717a2a74ac775b9b8923", "note": "", "attributes": {}, "original_total_price": 2390, "total_price": 2390, "total_discount": 0, "total_weight": 0.0, "item_count": 2, "items": [{ "id": 31286186180719, "properties": { }, "quantity": 2, "variant_id": 31286186180719, "key": "31286186180719:404d70730b155abbf5e62b28445537ae", "title": "RO - 1. Darkest Brown \u0026amp; Dark Auburn Mix", "compare_at_price": 1595, "compare_line_price": 3190, "price": 1195, "original_price": 1195, "discounted_price": 2390, "line_price": 2390, "original_line_price": 2390, "total_discount": 0, "discounts": [], "sku": "31593080-233", "grams": 0, "vendor": "Newellar", "taxable": true, "product_id": 4380382494831, "gift_card": false, "url": "\/products\/ro?variant=31286186180719", "image": "\/1.jpg?v=1584483449", "handle": "royal-messy-hair-bun", "requires_shipping": true, "product_type": "", "product_title": "RO", "variant_title": "1. Darkest Brown \u0026 Dark Auburn Mix", "variant_options": ["1. Darkest Brown \u0026 Dark Auburn Mix"] } ], "total_compare_price": 3190, "currency": "EUR", "items_subtotal_price": 2390, "cart_level_discount_applications": [] }
我设法做的最后一件事是执行请求并在控制台日志中获取所有必要的信息。事情是这样的：
$.ajax({
type: 'GET',
url: '/cart?view=data',
success: function(response) {
json_response = JSON.parse(response);
console.log( 'response', json_response );
},
error: function(status) {
console.warn( 'ERROR', status );
}});
还需要为每个产品获取 compare_line_price 的值，为购物车获取 total_compare_price 的值。然后，使用把手，我可以显示它们。不幸的是，我没有从中学到任何东西，我是自学成才的，所以朝这个方向迈出的每一步都很困难。我希望有人能告诉我下一步该怎么做。
{%- layout none -%}
{%- assign cartJson = cart | json -%}
{%- assign cartToken = cartJson | split:'token":"' | last | split:'"' | first | json -%}
{% assign total_cart_compare_price = 0 %}
{
"token": {{ cartToken }},
"note": {{ cart.note | json }},
"attributes": {{ cart.attributes | json }},
"original_total_price": {{ cart.original_total_price | json }},
"total_price": {{ cart.total_price | json }},
"total_discount": {{ cart.total_discount | json }},
"total_weight": {{ cart.total_weight | json }},
"item_count": {{ cart.item_count | json }},
"items": [
{%- for item in cart.items -%}
{
"id": {{ item.id | json }},
"properties": {
{%- for prop in item.properties -%}
{{ prop | first | json }}:{{ prop | last | json }}{% unless forloop.last %},{% endunless %}
{%- endfor %}
},
"quantity": {{ item.quantity | json }},
"variant_id": {{ item.variant_id | json }},
"key": {{ item.key | json }},
"title": {{ item.title | json }},
"compare_at_price": {{ item.variant.compare_at_price | json }},
"compare_line_price": {{ item.variant.compare_at_price | times: item.quantity | json }},
"price": {{ item.price | json }},
"original_price": {{ item.original_price | json }},
"discounted_price": {{ item.line_price | json }},
"line_price": {{ item.line_price | json }},
"original_line_price": {{ item.original_line_price | json }},
"total_discount": {{ item.total_discount | json }},
"discounts": {{ item.discounts | json }},
"sku": {{ item.sku | json }},
"grams": {{ item.grams | json }},
"vendor": {{ item.vendor | json }},
"taxable": {{ item.taxable | json }},
"product_id": {{ item.product_id | json }},
"gift_card": {{ item.gift_card | json }},
"url": {{ item.url | json }},
"image": {{ item.variant.image | json }},
"handle": {{ item.product.handle | json }},
"requires_shipping": {{ item.requires_shipping | json }},
"product_type": {{ item.product.type | json }},
"product_title": {{ item.product.title | json }},
"variant_title": {{ item.variant.title | json }},
"variant_options": {{ item.variant.options | json }}
}{% unless forloop.last %},{% endunless %}
{% assign compare_price = item.variant.compare_at_price | times: item.quantity %}
{% assign total_cart_compare_price = total_cart_compare_price | plus: compare_price %}
{%- endfor -%}
],
"total_compare_price": {{ total_cart_compare_price | json }},
"currency": {{ cart.currency.iso_code | json }},
"items_subtotal_price": {{ cart.items_subtotal_price | json }},
"cart_level_discount_applications": {{ cart.cart_level_discount_applications | json }}
}
替代购物车模板如下所示。
将您的购物车液体更新为以下内容：
{%- layout none -%}
{%- assign cartJson = cart | json -%}
{%- assign cartToken = cartJson | split:'token":"' | last | split:'"' | first | json -%}
{% assign total_cart_compare_price = 0 %}
{
"token": {{ cartToken }},
"note": {{ cart.note | json }},
"attributes": {{ cart.attributes | json }},
"original_total_price": {{ cart.original_total_price | json }},
"total_price": {{ cart.total_price | json }},
"total_discount": {{ cart.total_discount | json }},
"total_weight": {{ cart.total_weight | json }},
"item_count": {{ cart.item_count | json }},
"items": [
{%- for item in cart.items -%}
{
"id": {{ item.id | json }},
"properties": {
{%- for prop in item.properties -%}
{{ prop | first | json }}:{{ prop | last | json }}{% unless forloop.last %},{% endunless %}
{%- endfor %}
},
"quantity": {{ item.quantity | json }},
"variant_id": {{ item.variant_id | json }},
"key": {{ item.key | json }},
"title": {{ item.title | json }},
"compare_at_price": {{ item.variant.compare_at_price | json }},
"compare_line_price": {{ item.variant.compare_at_price | times: item.quantity | json }},
"price": {{ item.price | json }},
"original_price": {{ item.original_price | json }},
"discounted_price": {{ item.line_price | json }},
"line_price": {{ item.line_price | json }},
"original_line_price": {{ item.original_line_price | json }},
"total_discount": {{ item.total_discount | json }},
"discounts": {{ item.discounts | json }},
"sku": {{ item.sku | json }},
"grams": {{ item.grams | json }},
"vendor": {{ item.vendor | json }},
"taxable": {{ item.taxable | json }},
"product_id": {{ item.product_id | json }},
"gift_card": {{ item.gift_card | json }},
"url": {{ item.url | json }},
"image": {{ item.variant.image | json }},
"handle": {{ item.product.handle | json }},
"requires_shipping": {{ item.requires_shipping | json }},
"product_type": {{ item.product.type | json }},
"product_title": {{ item.product.title | json }},
"variant_title": {{ item.variant.title | json }},
"variant_options": {{ item.variant.options | json }}
}{% unless forloop.last %},{% endunless %}
{%- if item.variant.compare_at_price != blank -%}
{%- assign compare_price = item.variant.compare_at_price | times: item.quantity -%}
{%- else -%}
{%- assign compare_price = item.line_price -%}
{%- endif -%}
{% assign total_cart_compare_price = total_cart_compare_price | plus: compare_price %}
{%- endfor -%}
],
"total_compare_price": {{ total_cart_compare_price | json }},
"currency": {{ cart.currency.iso_code | json }},
"items_subtotal_price": {{ cart.items_subtotal_price | json }},
"cart_level_discount_applications": {{ cart.cart_level_discount_applications | json }}
}
然后尝试使用下面的AJAX请求：
$.ajax({
type: 'GET',
url: '/cart?view=data',
success: function(response) {
json_response = JSON.parse(response);
console.log( 'response', json_response );
// Here's your total compare price
console.log( 'total_compare_at_price', json_response.total_compare_price );
},
error: function(status) {
console.warn( 'ERROR', status );
}
});