Need help retrieving options page data, previous forums haven't helped

Hey all,

I am attempting to retrieve the options page data for a theme iā€™m building. I followed the previous threads like:

&

but I am still finding no success.

I am attempting to hit this endpoint:

https://gatorworksfron.wpengine.com/wp-json/acf/v3/options/options

to just see the data BUT the problem iā€™m having is that the handler iā€™m making isnā€™t added to the frontity.libraries.source and I donā€™t know why.

Here is a link to clone my repo:

git clone Bitbucket

I just updated it and made it public. Any help would be greatly appreciated, thanks!

Hi @brian.tucker

Welcome to the Frontity community.

You may need to use libraries.source.api.get to fetch the data from a specific endpoint such as https://gatorworksfron.wpengine.com/wp-json/acf/v3/options/options.

You will then also need to add the fetched data into the state using libraries.source.populate, as libraries.source.api.get doesnā€™t automatically populate the state in the way that actions.source.fetch does.

Would i be attempting to use that in the beforeSSR? I was able to view the acfOptionsHandler in frontity.libaries.source now but the data for the options is not be fetched. I tried using ā€˜libraries.source.api.getā€™ and then populating, but i found no success.

I followed your instructions on how to add the Wordpress menus and got a better understanding of handlers. But not able to replicate the addition of this handler using a seperate file, i get the error ā€œcannot read property ā€˜startswithā€™ of undefinedā€

When keeping the handler inside the root index, it adds to the frontity.libaries.source fine. Really not sure why the data isnā€™t fetching.

Any other insight would appreciated, thank you for the help so far!

Making a handler isnā€™t that complex, although thereā€™s a minor ā€œfeatureā€ (aka issue) with patterns which look like regular URLā€™s.

The following should work (not tested):

export const acfHandler = {
    name: "acf-options",
    priority: 10,
    pattern: "@acf/options",
    func: async ({ link, params, state, libraries }) => {
      const { api } = libraries.source;
      const { slug } = params;
  
      // 1. fetch   the data you want from the endpoint page
      const response = await api.get({
        endpoint: `/acf/v3/options/options`,
      });
  
      // 2. get an array with each item in json format
      const items = await response.json();
  
      // 3. add data to source
      const currentPageData = state.source.data[link];
      Object.assign(currentPageData, {
        items: items,
        isAcfOptions: true,
      });
    },
  };
  
  export default acfHandler;

I was able to get the file to work with this, thanks! Iā€™m still struggling to fetch the data from the endpoint though

I was able to get it to work, I had to combine my beforeSSR functions and use a Promise.all on the fetch calls. I am able to see the options now though. Thank you @mburridge & @Johan for the help!

1 Like