从 Contentful 条目 id 获取图像 URL答案

【问题标题】：Getting image URL from Contentful entry id从 Contentful 条目 id 获取图像 URL
【发布时间】：2018-08-09 06:39:14
【问题描述】：

我需要从 Contentful 条目 ID 中获取图像 URL。我从内容查询中得到这样的 JSON

{
"sys":{
  "space":{
     "sys":{
        "type":"Link",
        "linkType":"Space",
        "id":"8v1e7eaw70p2"
     }
  },
  "id":"1JfEwVlD9WmYikE8kS8iCA",
  "type":"Entry",
  "createdAt":"2018-02-28T18:50:08.758Z",
  "updatedAt":"2018-02-28T18:50:08.758Z",
  "revision":1,
  "contentType":{
     "sys":{
        "type":"Link",
        "linkType":"ContentType",
        "id":"image"
     }
  },
  "locale":"en-US"
},
"fields":{
  "name":"heat",
  "image":{
     "sys":{
        "type":"Link",
        "linkType":"Asset",
        "id":"6Inruq2U0M2kOYsSAu8Ywk"
     }
  }
}
}

我正在使用他们提供的 JS 驱动：

client.getEntry()

那么如何通过该链接：6Inruq2U0M2kOYsSAu8Ywk ？

【问题讨论】：

标签： contentful

【解决方案1】：

很遗憾，js SDK 在使用单一入口端点（即client.getEntry()）时将无法解析链接，因为没有足够的数据。

当我总是建议解决这个问题时，将集合端点与查询一起使用，并将所需的 id 作为查询参数。这样，您将始终获得所需的条目及其所有链接数据。你的代码应该是这样的

client.getEntries({'sys.id': '6Inruq2U0M2kOYsSAu8Ywk'})
  .then(response => console.log(response.items[0].fields.image.fields.file.url))

我希望这会有所帮助。最好的，哈立德

【讨论】：

我不得不使用 {sys: {id: '<the id>'}} 而不是使用 'sys.id' 才能正常工作，只是提醒一下。
即使使用 sys id 也不会返回 URL。（对于 getEntries）

【解决方案2】：

使用client.getEntries({'sys.id': '1JfEwVlD9WmYikE8kS8iCA'}) 获取输入字段和资产字段。

您还可以通过在获取数据后运行以下命令将资产修补到字段：

/* Patch all the assets to the fields */
  const patchAssets = (fields, assets) => {
    Object.keys(fields).forEach(function (key) {
      let obj = fields[key];
      if (obj.sys && obj.sys.linkType === 'Asset') {
        const assetId = obj.sys.id;
        const matchAsset = assets.find(asset => {
          return asset.id === assetId;
        });
        obj.file = matchAsset;
      }
    });
    return fields;
  };

【讨论】：

【解决方案3】：

获取图片网址的另一种方法是使用getAsset('<asset_id>')。所以首先，使用getEntry()方法，需要获取入口数据，然后从字段中提取id：fields.image.sys.id，传递给getAsset方法。

【讨论】：

谢谢。但是如何使用 getEntries 检索图像 url？此解决方案会产生瀑布问题。