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:

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

Solution

DunkinDeez•99d ago

Paddy•99d ago

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.

YAGPDB.xyz•99d ago

Gave +1 Rep to @DunkinDeez (current: #15 - 2)

Arcane•99d ago

@Paddy has reached level 1. GG!

Paddy•99d ago

@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.

YAGPDB.xyz•99d ago

Gave +1 Rep to @DunkinDeez (current: #10 - 3)

DunkinDeez•99d ago

if you console.log(req) in the handler you should see the object in the console

Arcane•99d ago

@DunkinDeez has reached level 2. GG!

DunkinDeez•99d ago

either in the service worker or in the popup page you don't need the extension id in the sendToBackground call

Paddy•99d ago

Thank you, I don't seem to see console.log(req), returning in my console.

YAGPDB.xyz•99d ago

Gave +1 Rep to @DunkinDeez (current: #10 - 4)

Paddy•99d ago

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.

Paddy•99d ago

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.

🧩 Plasmo Developers Join

2.1KMembers

View on Discord

Want results from more Discord servers?

Add your server

Is Vanilla JavaScript supported?Hey! Does Plasmo support vanilla JavaScript only?Struggling with Plasmo Messaging API: Sending Message from CSUI to BGSW IssueHey guys, I've tried so far to understand how Plasmo Messaging API works (from CSUI to BGSW) and alt How can I listen to all requests?I am trying to create an extension that will intercept all requests that were made on the webpage. H Dynamically change iconHow can I achieve this?Style / Font consistency between content scriptsHey! I'm wondering if anyone else has ran into issues with content script's styling and fonts being Build fails after changing TS path aliasI changed the default path alias from `"~*": ["./src/*"]` to `"~/*": ["./src/*"]` and updated all im Disable content-ui per siteHi, I'm developing pretty advanced extension and got a request for option to disable/enable the exte Plasmo Injected CSUI disappears on ClickI have a plasmo extension where i am injecting a component ui using conten script and i am making it Welp guess it's dead xdWelp guess it's dead xd @Pallas#2819 What are the differences@Pallas What are the differences between the dev end build versions of the extension ? The same code Building a standalone EmbedHey everyone! I have an extension I've been building with Plasmo for work and we were asked to also How to install a npm package?I'm trying to build a chrome extension by using Plasmo, after initialize a project, and I installed Extension Network QuestionCan a fetch in extension ( CSUI React) handled by website's service worker ?How to include JSON file referenced in manifest (Failed to resolve file.json)I'm trying to setup "declarative_net_request" in the manifest. However whenever i include the resour CSUI Best practices questionCan I get some advice on what is the best way for me to append a new button shown in the screenshots CSUI Best practices questionCan I get some advice on what is the best way for me to append a new button shown in the screenshots Trigger content scripts from background.ts?Hello everyone, I have some content scripts like that. I want to trigger on of them to re-run from b Plasmo setup with NX consoleHello everyone, I'm trying to create an extension app inside my nx monorepo and really would love to Is it possible to wrap page elements in the document root?Context is that i'm trying to use MUI tabs to add additional content with the page document as the f Performance implications of multiple content script and one redux storeHey, I'm wondering if someone has tested if the shared Redux store across multiple content scripts w

Gaming

Programming

How to send API requests with messaging?