Options for Real-Time Data Integration
Table of Contents
Real-Time Data are an essential feature for dynamic content delivery. This document provides an overview of three approaches to utilise live data in content: API endpoint, iFrame and screen scrape web.
API endpoint
API integration is a process where we actively retrieve data from an external source through a designated API endpoint. This involves establishing a connection to the API, making requests for specific data, and handling the received information. In addition to fetching the data, the integration process extends to applying styling on our platform. Styling includes formatting the data to meet the visual design standards, ensuring a seamless and cohesive presentation for users.
This will require some custom work. To proceed with the implementation, we need specific information from you:
- API Endpoint: Provide us with the endpoint that we will connect to for retrieving the data.
- CORS Enablement: This is essential for allowing our platform to make requests to the API from a different domain.
- Design Preferences: Provide us with a design specifications for displaying the data. Information such as layout, colours, and any specific styling requirements.
- Data Format: Confirm that the API delivers data in JSON format. This ensures a standardised and easily readable structure for the information, promoting compatibility and efficient processing on our platform.
- Update Frequency: Specify the desired frequency for data updates. Understanding how often the data should be refreshed ensures that our platform remains synchronised with the latest information, providing an up-to-date user experience.
An example of us fetching data from an API endpoint is score result displayed in the image.
Boston Globe app: Score result
iFrame
The utilisation of an iframe introduces a unique approach by providing an embeddable page dedicated to showcasing live content. This embed, hosted and managed by you, encompasses all styling for articles, granting you the flexibility to update it as frequently as required. The offline behaviour of iframes depends on what content the iframes are displaying. But they will not work properly if it requires an internet connection to load.
To implement this, we only require the embed URL from you.
Examples of using iframe include:
-
Including an Entire External Page as a Tab: apps like Euromoney and CNN effectively incorporate this. If you intend to secure the content within the tab, some custom work will be required.
.
Euromoney app: Live tab with iframe Euromoney app: Content locked CNN app: Markets tab
-
Using the iFRAME Card: the iFRAME card functionality, as detailed in document , enables the integration of external widgets seamlessly into timeline as image bellow for inews app.
inews app: sports
- Inline iFRAMES in Articles: where specific sections or content from external sources are embedded directly into the article body, enhancing the richness of the content.
Screen Scrape Web
Screen scraping is a technique for extracting data from a website by fetching its HTML content and extracting relevant information programmatically. This method involves sending request to the web server, parsing the HTML, and selectively retrieving desired data. Once the data is obtained, it can be seamlessly integrated into an HTML card which can be displayed in the timeline.
This will require some custom work. An illustration of this process is demonstrated in AGBI app, where we extract the HTML of the closing price from the webpage, as depicted in the image below.
AGBI app: closing prices