Question

我正在使用shopify-buy SDK尝试仅在前端使用JavaScript，并按照https://shopify.github.io/js-buy-sdk/#expanding-the-sdk此处的“扩展SDK”的说明从Shopify商店中获取商品。

使用下面的代码，我可以检索我的文章和所需的某些字段。

// Build a custom query using the unoptimized version of the SDK
const articlesQuery = client.graphQLClient.query((root) => {
  root.addConnection('articles', {args: {first: 10}}, (article) => {
    article.add('title')
    article.add('handle')
    article.add('url')
    article.add('contentHtml')
  })
})

// Call the send method with the custom query
client.graphQLClient.send(articlesQuery).then(({model, data}) => {
  console.log('articles data')
  console.log(data)
})

但是，我确实确实还需要为每篇文章提取特色图片，不幸的是，当我在我的ArticlesQuery中添加行article.add('image')时，结果文章数据记录为null。我尝试构建一个自定义的productQuery，这有一个类似的问题-我可以检索一些产品字段，但是当我尝试添加行product.add('images')时，我只是从店面API中返回了null。

有人有建立自定义/扩展查询并成功检索图像的经验吗？

Answer 1

尝试以下操作：

// Fetch all products in your shop
client.graphQLClient.fetchAll().then((acticles) => {
  console.log(acticles);
});

然后在控制台中检查您的文章具有哪种可用的属性名称。如果SDK允许您获取任何图像数据，那么肯定应该有imageSrc ||之类的内容。 imageUrl || img ......

Answer 2

感谢Rebecca Friedman在js-buy-sdk存储库的github问题部分提供了这种可行的解决方案：

const articlesQuery = client.graphQLClient.query((root) => {
  root.addConnection('articles', {args: {first: 10}}, (article) => {
    article.add('title')
    article.add('handle')
    article.add('url')
    article.add('contentHtml')
    article.addField('image', {}, (image) => {
      image.add('id')
      image.add('originalSrc')
    })
  })
})

// Call the send method with the custom query
client.graphQLClient.send(articlesQuery).then(({model, data}) => {
  console.log('articles data')
  console.log(data) // works!
})

由于image字段是其自己的对象，因此您必须添加一个回调函数来指定所需的字段。

使用Shopify JavaScript Buy SDK自定义查询检索文章对象及其图像

2 个答案: