Resolve links from direct HTTP calls to API

APIs Content Delivery API
1

I’m calling the Content Delivery API from an Angular app and attempting to retrieve a collection of entries (all of the same content_type) and include the related assets in each entry (e.g. resolveLinks using the include param).

I’m able to retrieve a collection of entries of the desired content_type, but the assets are lumped together in an “Asset” array (not included directly in each entry).

Any idea if this is possible?

Thanks

2

Hi Ian,

It ultimately depends on how you’re configuring you client, but if you enable resolveLinks through the JS SDK, you should be able to seamlessly fetch the content from these linked items.

3

Gabriel,

I’m not using the JS SDK, I’m calling the API directly via HTTP calls. There essentially isn’t a “client”.

The documentation indicates that the “include” param is functionally the same as “resolveLinks”.

Thanks

4

Hi @ian.r.sherwood,
In that case, it’s unfortunately not possible - as the API by itself doesn’t yet provide the ability to automatically resolve links, as in our SDKs.

5

OK, I’ll just have to use the SDK then. Thanks for confirming!

6

I too am using contentful with angular and find that the contentful.js lib has too much extra JS that is redundant including axios.

So I dug around in the source for the contentful.js lib and found that it uses GitHub - contentful/contentful-resolve-response: Resolve items & includes of a Contentful API response into a proper object graph to resolve the links.

So I have a very simple client that can resolve the links with none of the dependencies. Warning, this is not tested and does not do any kind of error handling. It’s very rough.

@Injectable({
  providedIn: 'root'
})
class ContentfulClientService {
  private space = 'oops'
  private accessToken = Utils.contentfulKey
  private host = Utils.contentfulHost
  private http = inject(HttpClient)

  getEntries(params) {
    const qs = new URLSearchParams(params)
    return this.http.get(`https://${this.host}/spaces/${this.space}/environments/master/entries?${qs}`, {
      headers: {
        Authorization: `Bearer ${this.accessToken}`
      }
    }).pipe(
      map((resp: any) => {
        return {
          ...resp,
          items: resolveResponse(resp, {
            itemEntryPoints: ['fields'],
          })
        }
      })
    )
  }
}