API requests for pages

Ask us anything How do I?
1

I’m trying to find an ergonomic and idiomatic way to load data for a single page.

For context, I have a member page that shows the data of one member. There are many members, so it doesn’t make sense for me to load all of the data for each member into a persistent collection that I then reference for this member. My current thought is that on the member’s page load, I should run a workflow that makes the API call, and stores the result in a variable for use. This seems to be the method referenced in Two Options for Creating a Dynamic Collection Page as " 1. Bind to variable data".

So my idea of how to accomplish this is:

  1. Pass the id of the member in the page URL, say /member/:id
  2. In the workflow, make a request to the api, say /member/:id using the param from the page URL
  3. Save this to a variable
  4. Parts of the member page reference this variable

This seems sensible to me, however, step 2 always fails when I demo loading the page. If i do it with “edit” enabled, it seems to work fine, but if I switch to “preview”, when I navigate to this page, it thinks that the id in the url is “undefined”.

A few extra details about the state:

  • The worflow is set to run “on mounted”, so I wonder if it can’t see the URL properly at that point
  • I wonder if I’m passing the param in properly to the URL

Any insight would be appreciated!

2

if it works in edit mode but not in oreview it may be bacause you are accessing window directly. try to replace window with wwLib.getFrontWindow().

1 Like
3

I managed to fix this from moving the workflow from a component on the page with the trigger “on mounted” —> the page itself with the trigger “on page load (before fetching collections)”. Didn’t know I could put workflows there before.