The Content Delivery API

The Content Delivery API is used to retrieve content from Dynamic Content in JSON format. This content can then be consumed by a website, app or e-commerce system. Both slots and individual content items are stored as JSON content and retrieved using their unique ID.

The Delivery API allows you to access content via a simple HTTP GET request, which returns the content in JSON-LD format. The API can be used to retrieve both published and unpublished content. For unpublished content, the production domain c1.adis.ws is replaced by a virtual staging environment (VSE) domain with the rest of the query remaining unchanged.

Don't use a VSE to serve production content

Note that VSEs should not be used to serve published, production content. If we notice excessive traffic from your VSE it will automatically be rate limited and may be disabled by our operations team. Therefore please ensure that all your production code uses the production domain of c1.adis.wsto serve content to your live environment and the appropriate media domains such as i1.adis.wsto serve published media.

Request

The Delivery API can be accessed using the URL

https://c1.adis.ws/cms/content/query?

suffixed with the a URL encoded query of the following form (where id is the unique identifier of the content to be retrieved):

{"sys.iri": "{id}"}

Here is an example AJAX / jQuery client-side Javascript code for a fully formed content query:

$.ajax({url:"https://c1.adis.ws/cms/content/query?query=%7B%22sys.iri%22%3A%22http%3A%2F%2Fcontent.cms.amplience.com%2F38a0e0a1-efad-4e04-be1e-10a042f02354%22%7D&scope=tree&store=ampproduct&fullBodyObject=true", 
success: function(data){ }

Parameters

store is the endpoint for your published content. If you are consuming unpublished content within a virtual staging environment, then you can just specify store=store because the VSE will contain the rules that define where content is retrieved from.

scope specifies the objects that are returned by the API:

scope description
tree Returns the full dependency tree
root Returns only the root object


if no value is specified, then scope will be set to 'tree'.

fullBodyObject indicates whether to return the full body of each content object or just the @id's - defaults to true if omitted

Note that whereas this example uses "sys.iri":"iri" to query a single content-identifying IRI, it is possible instead to use the MongoDB syntax "$in" operator to query a list of IDs as shown in this JSON code:

{
  "query": {
    "sys.iri": {
      "$in": [
        "http://content.cms.amplience.com/{{id}}"
      ]
    }
  },
  "store": "ampproduct"
}

Finding the content/ slot id

You can find the id of a particular content item or slot from the production view. Select and right click the content or slot item for which you want to get the id and choose "Get content id" from the contextual menu. The id will be displayed and you can copy this to the clipboard. You'll use the id to retrieve the slot or content item.

Getting the slot id
Getting the slot id

The query to return the contents of this slot is shown below (decoded for reference)

https://c1.adis.ws/cms/content/query?query={"sys.iri":"http://content.cms.amplience.com/1f0fe60d-7b4b-4a39-a757-a1b221944443"}&scope=tree&store=ampproduct&fullBodyObject=true

This query will return the content in JSON Linked Data (JSON-LD) format as a content graph.

The JSON-LD is shown below.

{ "@context":"http://context.system.cms.amplience.com/v0.0/api", "@type":"QueryResult", "result":[ { "@id":"http://content.cms.amplience.com/1f0fe60d-7b4b-4a39-a757-a1b221944443" } ], "@graph":[ { "_meta":{ "schema":"https://s3-eu-west-1.amazonaws.com/amp-product/tutorials/dynamiccontenttutorials/bannerslot.json", "name":"home-page-banner-slot" }, "bannerslot":{ "@id":"http://content.cms.amplience.com/38a0e0a1-efad-4e04-be1e-10a042f02354", "@type":"https://s3-eu-west-1.amazonaws.com/amp-product/tutorials/dynamiccontenttutorials/tutorialbanner.json" }, "@type":"https://s3-eu-west-1.amazonaws.com/amp-product/tutorials/dynamiccontenttutorials/bannerslot.json", "@id":"http://content.cms.amplience.com/1f0fe60d-7b4b-4a39-a757-a1b221944443" }, { "_meta":{ "schema":"https://s3-eu-west-1.amazonaws.com/amp-product/tutorials/dynamiccontenttutorials/tutorialbanner.json", "name":"spring-sale-banner" }, "calltoactiontext":"Find out more", "background":{ "@id":"http://image.cms.amplience.com/500118e2-a788-4b89-89bd-b4c8b0373091" }, "calltoactionurl":"https://www.anyafinnstore.com/springsale", "strapline":"Bank holiday sale coming soon", "headline":"Get ready to update your wardrobe!", "@type":"https://s3-eu-west-1.amazonaws.com/amp-product/tutorials/dynamiccontenttutorials/tutorialbanner.json", "@id":"http://content.cms.amplience.com/38a0e0a1-efad-4e04-be1e-10a042f02354" }, { "_meta":{ "schema":"http://bigcontent.io/cms/schema/v1/core#/definitions/image-link" }, "id":"500118e2-a788-4b89-89bd-b4c8b0373091", "name":"orange_dress", "endpoint":"ampproduct", "defaultHost":"i1.adis.ws", "@id":"http://image.cms.amplience.com/500118e2-a788-4b89-89bd-b4c8b0373091", "mediaType":"image" } ] }

The inline content method

SDK The CMS JavaScript SDK includes an inlineContent method on the amp namespace which flattens the JSON-LD content returned by the Delivery API into a content graph.

Here's some example JavaScript code for calling inlineContent. In the code shown below, content is the JSON-LD content:

// Node.js
const amp = require('cms-javascript-sdk');
amp.inlineContent({{content}});
// Browser
<script type="text/javascript" src="cms-javascript-sdk.min.js"></script>
<script type="text/javascript">
  amp.inlineContent({{content}});
</script>

Example

The following code retrieves some content from Dynamic Content using the Delivery API and converts the returned JSON-LD into a content tree, logging the result to the console.

const url = 'https://c1.adis.ws/cms/content/query?query=%7B%22sys.iri%22%3A%22http%3A%2F%2Fcontent.cms.amplience.com%2F1f0fe60d-7b4b-4a39-a757-a1b221944443%22%7D&scope=tree&store=ampproduct&fullBodyObject=true'; $.ajax({ url: url, success: (data) => { // use the SDK to inline the content from the graphs. const inlineResult = amp.inlineContent(data); if(inlineResult && inlineResult[0]){ // log out the text from the inline content console.log(inlineResult[0].text); } } });

The output of the inline method is shown below. The JSON content is now organised into a content tree, so it can be combined with a handlebars template (or a template using another templating technology) and converted to HTML format to be rendered by a front end website or app or e-commerce system.

{ "@id":"http://content.cms.amplience.com/1f0fe60d-7b4b-4a39-a757-a1b221944443", "_meta":{ "schema":"https://s3-eu-west-1.amazonaws.com/amp-product/tutorials/dynamiccontenttutorials/bannerslot.json", "name":"home-page-banner-slot" }, "bannerslot":{ "@id":"http://content.cms.amplience.com/38a0e0a1-efad-4e04-be1e-10a042f02354", "@type":"https://s3-eu-west-1.amazonaws.com/amp-product/tutorials/dynamiccontenttutorials/tutorialbanner.json", "_meta":{ "schema":"https://s3-eu-west-1.amazonaws.com/amp-product/tutorials/dynamiccontenttutorials/tutorialbanner.json", "name":"spring-sale-banner" }, "calltoactiontext":"Find out more", "background":{ "@id":"http://image.cms.amplience.com/500118e2-a788-4b89-89bd-b4c8b0373091", "_meta":{ "schema":"http://bigcontent.io/cms/schema/v1/core#/definitions/image-link" }, "id":"500118e2-a788-4b89-89bd-b4c8b0373091", "name":"orange_dress", "endpoint":"ampproduct", "defaultHost":"i1.adis.ws", "mediaType":"image" }, "calltoactionurl":"https://www.anyafinnstore.com/springsale", "strapline":"Bank holiday sale coming soon", "headline":"Get ready to update your wardrobe!" }, "@type":"https://s3-eu-west-1.amazonaws.com/amp-product/tutorials/dynamiccontenttutorials/bannerslot.json" }

results matching ""

    No results matching ""