Integrate with another API

🙋Get Help
1

We have one API which could fetch the content. How can we integrate with this API to fetch the content and then insert the content info WP via WP REST API ?

Does Frontity support this kind of feature ? Thanks

BR//CJ

2

Could you explain a bit more what the flow of the content has to be?

Because Frontity is designed to work with the WP REST API, but you can easily make requests to other API’s as well (eg. I connect to the Google API to send and retrieve data, and display this inside Frontity).

If you want to know how to import data from an external API with Frontity and then send it to WordPress, then it’s technically possible but completely out of scope.
In that case it’s easier to build a WP plugin to access the external API and import the data directly.

3

Hi Johan,

Thanks for the suggestion.

“In that case it’s easier to build a WP plugin to access the external API and import the data directly.”
Do you have some example for my ref ? I google , but no lucky.

4

By the way, is it possible to the example for “connect to the Google API to send and retrieve data, and display this inside Frontity”
i’m new on Frontity

5

That really depends on the API you want to access. Most bigger API’s already have plugins or other solutions available for WordPress. Smaller or custom API’s require custom code, so in that case you’ll need a PHP Developer to build it for you.
In short; make a simple WP plugin (eg. with the WP Plugin Boilerplate) and add the import code to it (depending on the type of API and type of content).

This is an extremely simple handler for Frontity which retrieves the Google PageSpeed Insight scores:

import {fetch} from 'frontity';

const pagespeedHandler = {
    name: "pagespeed",
    priority: 10,
    pattern: "@pagespeed/:url",
    func: async ({ link, params, state, libraries }) => {
        const { url } = params;

        const response = await fetch('https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=' + encodeURIComponent('https://' + url) + '&key=<google_api_key>' + '&category[]=PERFORMANCE&category[]=SEO');

        // Parse the JSON to get the object
        const data = await response.json();

        // Add the form data to source.data
        const pagespeed = state.source.data[link];
        Object.assign(pagespeed, {
            data: data
        });
    },
};
  
export default pagespeedHandler;

and this can be used for any external source.