Plugin that returns data from API

Need help Plugins
1

A small disclaimer, my js knowledge especially when trying to use fetch etc is quite limited so the below is what I came up with, by reading and using examples (and a bit of chatgpt).

So what I’m trying to do is create a plugin that

  1. Calls an API
  2. Retrieves the text
  3. Processes the text as I need to manipulate it before returning it back
  4. Then returns the processed text

I tried a lot of different methods and all of them were pointing me to one direction. That I need to use context.request or context.async for some reason. Whatever I did though would return an undefined text 15 which I assume is because the return is fired before the call ends. I know the API call is correct because in the plugin output in the logs, I do see the correct call. But when trying to display the manifest, I get an undefined. There are no errors or anything else that is wrong with the call.

So what am I doing wrong? and how can I properly use context.async and context.request? The bubble.io documentation is really poor in that respect

function(properties, context) {
    
  console.log("Start Workflow");
    
    
  const fetch = require("cross-fetch");
  var url = "https://anexample.com/"+ properties.catalog_id +"/albums/"+ properties.album_id ;

  let manifest = context.async(async callback => {
    try{  
      console.log("Fetching data")  
      let response = await fetch(url, {
          headers: {
            "Authorization": "Bearer "+properties.auth_key,
            "X-API-Key": "asfasfasfafasf"
          }


        })
      
        .then((response) => response.text())
 		 .then((data) => console.log(data));

      ;
      console.log("Fetching data Complete");  

      let data = await response;
        
      callback(null, data);
      console.log("Callback Complete");  

    }
    catch(err){
      callback(err);
      console.log("Error found");  

  }});
    console.log("Starting manifest ");  

  console.log (manifest);
  return {text15: manifest}
  console.log("End Workflow ");  

}
2

It looks like you don’t have clear in your mind how to work with promises in javascript.
I suggest you to read a bit about it here

3

No you are right I’m not comfortable with promises but did read a lot :slight_smile: (even the link you sent). Did you spot a mistake in the code ?

I can do a lot of things within fetch() but what I can’t figure is, how to get things outside of that function nor do I know how to search for it because it really relies on context.async which is a bubble function .

I did add a disclaimer that my JS knowledge is limited but I’m trying to learn and spent the whole day yesterday trying to figure this out.

4

The problem is that your code randomly mix async/await with then handlers, you need to choose one.
If you read again the page I linked you will see plenty of examples.
My suggestion is to try your function logic first locally on your machine and check that it’s working. Then you can adapt it to bubble’s api.

5

Thanks for the pointers that already helps. I did try it different examples outside before but when translating that in bubble none of them seemed to work. And then I read about this in the documentation and got scared. So I started looking in the forums and this is a result of what I came up with on context.async The context.async really throws me off. Trying to find more info on it or what it replaces is not easy.

Do you know if using just then handlers, works on bubble without any issues ? I want to avoid spending yet another day trying to figure out what works and what not within the plug-in editor

> **Note:** When writing server-side actions, avoid using async/await syntax to wait for promises. The framework we use to to handle asynchronous code (notably used in context.asyncorcontext.request ) relies on a special library called "Fibers", which works very differently from usual promises and will cause unexpected behavior if async/await is used. Consider using the traditional Promise.then/catch syntax instead, which is supported by Fibers.

6

As I said your function logic has problems even before adding context.async.
Make it run locally on your machine as a node script, then when it’s working use it in the plugin.
You can find plenty of examples in the forum about how to use context.async.
See here for a recent example.