在 BigCommerce 的自定义页面上获取并插入产品价格答案

【问题标题】：Fetch and insert product price on a custom page in BigCommerce在 BigCommerce 的自定义页面上获取并插入产品价格
【发布时间】：2016-09-09 21:10:22
【问题描述】：

是否可以为 BigCommerce 中的自定义页面动态获取和插入产品价格？

我正在创建一个自定义页面，详细介绍 BigCommerce 中的特定产品，我希望能够从系统中获取每个产品的产品价格，而不是在页面上手动设置。

这样，如果产品的价格发生变化，价格当然会在自定义页面上动态变化。

我知道 BigCommerce 使用 %%GLOBAL_ProductPrice%% 在产品页面和整个网站的其他代码中调用价格，但不知道如何在我将列出多个产品的自定义页面上使用它。

【问题讨论】：

为什么不为这些产品创建一个类别，并分配一个自定义类别布局文件以获得所需的布局/功能？
@tim-diztinct，这是一个很好的建议！非常感谢。它的简单性让我难以捉摸。

标签： bigcommerce

【解决方案1】：

我真的很喜欢@tim-diztinct 的回答，如果可以的话，我会建议您这样做。

但除此之外，替代/硬方法是使用 JavaScript 直接从实时产品页面获取价格。

在 BigCommerce 中，您可以使用以下两个标准化 URL 之一快速访问产品页面：
1.store_url.com/products.php?product=product name here
2.store_url.com/products.php?productId=productIdHere（我的首选）

因此，如果您想从产品页面获取实时价格，您可以对产品页面进行 Ajax 调用，并解析价格内容...

/**
 * Makes an HTTP GET to an external product page
 * and parses that page for the product's current price.
 * @param pid <int> - The product ID to search for. 
 * @return Promise  - Resolved with product price, reject on fail. 
 */
function getProductPrice(pid) {
  // Ensure pid parameter set:
  if (typeof pid == 'undefined') {
    throw new Error('Missing product ID.');
  } else {
    // Ensure pid is a non decimal number:
    pid = parseInt(pid);
  }
  // Return promise to contain the results...
  return new Promise(function(resolve, reject) {
    // Make an Ajax GET request to the product page:
    $.get("site_url_here.com/products.php?productId=" +pid, function(res) {
      // If request successful:
      if (res) {
        // The content for the product page is loaded in 'res'. 
        // The Price should be contained within a meta element within a div containing the class name 'Value'.
        // Below, we parse the html response for the meta element containing the price...
        resolve($(res).find('.Value > meta'').attr('content'));
      // Else request failed:
      } else {
        reject(false);
      }
    });
  });
}

//** Calling the above function **//
getProductPrice(25).then(function(price) {
  // Do something with the price (insert it into your custom page?)
  alert('The product price is ' +price);
}).catch(function(e) {
  console.log('Error getting product price - ', e);
});

我的最后一条建议是，由于我认为您的自定义页面上会有多种产品，因此您需要了解每种产品的价格。

我的建议是在与每个产品相关的某处包含产品 ID（例如 ID 或隐藏元素）。将所有ID解析成一个数组，这样forEach值就可以调用getProductPrice函数，然后注入到自定义页面上负责显示价格的元素中！

奖励：将价格保存在每 X 间隔过期的 cookie 中，并从那里读取重复的客户端请求。

【讨论】：