How to build member-specific dashboards with Webflow and Memberstack API calls without exposing API keys?
Hello, Sorry for the (maybe) stupid Question.
I want to build out a customer Dashboard and therefore display data in their personal sites that get pulled with api calls. Take Plausible for example.
Do I have a way to do that with Memberstack without exposing my API Key to the public?
Best regards,
Leon
Comments
4 comments
Julian Galluzzo Josh Lopez I'm curious if you guys know how something like this can be accomplished? i.e. Making API calls without exposing API keys to the public.
Hey Leon Stößel
Thank you for reaching out!
To assist you more effectively, could you please provide some additional details on what exactly you are trying to display on the page? If you are looking to show custom fields and your site is built with Webflow, you can leverage data attributes to achieve this. For non-Webflow sites, using our front-end DOM package would be the way to go. You can safely initialize it with your app's public key, which is public-safe.
Looking forward to your reply to better assist you!
Hey Josh Lopez,
Thank you for taking the time to answer!
To be more exact:
I want to have member specific dashboard that display data from our plausible account. The site is built with Webflow and Memberstack (or will be built).
This is just an example from the plausible api doc. The variable SITE_ID would be safed inside metadata for the memberstack users. The TOKEN would always be the same and has to be hidden.
Therefore it won't be possible for me to use the site specific page javascript in webflow to make the api call.
Also custom fiedls in memberstack are not of good use. Because i need to get the live data and synchronization into these live fields (as to my knowledge) will not be possible with direct API-Calls. I could in theorie have a make.com scenario run every minute or so, but this is not a scaleable solution in my eyes.
I hope i could give you some more context.
Cheers!
Thank you for the additional details, Leon Stößel!
I'm not personally experienced with Plausible, but I did review their documentation. It appears that using the Bearer Token directly in client-side environments like Webflow isn't recommended due to the sensitivity of the information. Memberstack, as you know, operates on the frontend.
To securely use Plausible without exposing your Bearer Token, you'd ideally need to handle this on a server. For instance, if you're set on using Webflow without backend capabilities, consider setting up a separate server to manage the Bearer Token securely.
Alternatively, switching to a React could be beneficial. This way, you can maintain your Bearer Token securely in a
.envfile, which keeps it hidden from the frontend entirely.I know this may not be the answer you want to hear but we try to be as transparent as possible when it comes to sensitive info.
Please sign in to leave a comment.