JSON Data Source
8 min
overview the json data source fetches an arbitrary json array from a remote url or a local resource file bundled with the app it is the escape hatch for data that does not come from the catalog api — external feeds, third party services, or static json files shipped with the app when to use this use json when your data lives outside the catalog api an external rest endpoint that returns a json array, or a static json file in the app's resource bundle if the data comes from the catalog api, use a more specific type like content or taxonomy instead basic example { "type" "json", "contextkey" "menulinks", "url" "https //example com/api/navigation json" } this fetches the json array from the given url and exposes it as $context menulinks each element of the array becomes an item available to child components configuration type specific properties property type default description url string — required url of the remote json endpoint, or a resource // path for local files headers object — http headers to include in the request (e g for authentication) using a local resource file to load a json file bundled with the app instead of a remote url, use the resource // scheme { "type" "json", "contextkey" "config", "url" "resource //data/config json" } the file must be placed in the app's resource directory at the corresponding path common configuration (inherited) all common data source properties apply — limit , offset , batchsize , contextkey , maxcacheage , preventssrcache , etc for more details, see todo insert link to data sources overview link advanced features dynamic url from context the url value supports $context interpolation { "type" "json", "contextkey" "feed", "url" "https //example com/api/feed/$context publication id json" } if the interpolated segment resolves to null or undefined , that url segment is automatically removed from the resulting string for more details on value interpolation, see todo insert link to value interpolation link testing notes / edge cases response must be a json array the endpoint must return a top level json array \[ ] a json object { } at the root will fail — wrap it or use a different approach cors remote urls must allow cross origin requests from the app's domain a blocked cors request silently returns an empty list on the client ssr vs client fetch on ssr, the url is fetched server side (no cors issue) on the client, cors applies set preventssrcache true if the data changes frequently or is user specific maxcacheage remote json is cached set maxcacheage appropriately for how frequently the external data changes authentication if the endpoint requires auth headers, use the headers property do not embed tokens directly in the url local resource files the file path is relative to the app's resource root a missing file returns an empty list with no visible error in the ui related topics todo insert link to data sources overview linktodo insert link to custom data source linktodo insert link to value interpolation link