How to send API requests with messaging?
Hey everyone,
I can't seem to figure out on my own how to send API calls using Plasmo? I see a lot of 'earlier' posts saying to use the
Messaging API
, but how could I create a simple API call to e.g. my Supabase DB or anything else?
I added a picture of what my "ideal" situation would be, if there is anyone with such experience needed I would love to know how you would tackle this.
Please let me know, anything would be highly appreciable!
Best regards.Solution:Jump to solution
to use the messaging api you would need to use the sendToBackground function from @plasmo/messaging in the jsx/tsx/content script. you need to create a message handler in background/messages/<handler_name>. The handler is where you would perform the api fetch request. Given your provided case I don't think any use of the messaging api is needed since the popup should be able to use the credentials as is
13 Replies
Solution
to use the messaging api you would need to use the sendToBackground function from @plasmo/messaging in the jsx/tsx/content script. you need to create a message handler in background/messages/<handler_name>. The handler is where you would perform the api fetch request. Given your provided case I don't think any use of the messaging api is needed since the popup should be able to use the credentials as is
Thank you so so much @DunkinDeez, this honestly gives me so much to work with, and hopefully understand what I can work on.
I think I am starting to understand now what they're saying in the docs. I will play around with this and hope to get it working, thank you so much!
I will let you know if I got it working.
Best regards.
Gave +1 Rep to @DunkinDeez (current:
#15
- 2
)@Paddy has reached level 1. GG!
@DunkinDeez Hey I think I followed the docs "correctly",
I installed and setup the @plasmohq/messaging as you told me by following the docs and your word.
How can I
console.log()
something to make sure it's working? How could I use a Button e.g. that will use this handler on an onClick()?
I am trying to understand now how to use this in my popup extension, if you understand what I mean.
Thank you so much.
Best regards.Gave +1 Rep to @DunkinDeez (current:
#10
- 3
)if you console.log(req) in the handler you should see the object in the console
@DunkinDeez has reached level 2. GG!
either in the service worker or in the popup page
you don't need the extension id in the sendToBackground call
Thank you, I don't seem to see
console.log(req)
, returning in my console.Gave +1 Rep to @DunkinDeez (current:
#10
- 4
)You mean calling it right? What am I calling exactly in my popup?
Thank you, I removed this, I placed it there just to be sure.
I got it to work @DunkinDeez!!
Able to send a
console.log
through the sendToBackground function to the handler.
I struggled way too hard with this at first, It might be an interesting idea if I could make a repo with this included so people can work from the start with fetching API requests with the Messaging API.
Instead having to do this yourself, it saves a little bit of time I think.
Best regards.