I’m working on a personal side project where I’m connecting to an API to show a certain platform’s content. All calls need a private development key in the header, which all works fine.
Besides ‘public’ content, it’s also possible to make personalized API requests (to show content made the user, for example…) by adding a additional header to each personal API request. In this header, there should be a User Token.
The user authentication is done by an external JS script I need to add to my app header. This script adds a login window of the service to my app, and returns a user token when the user logs in. I can manage to reveal this token in my browser’s Console.
I now run into the following issue: I need this token to be in the header of the personalized API requests – but I don’t know if it’s possible.
If anyone has any experience with setting this up, let me know!
You will want to use the Bubble API connector to make your “personalized API requests”
The Bubble API Connector has an option to add in “headers” (in your use case, you will add the User Token as a header)
You will want the header to be set dynamically (in your case the user token, will vary from user to user) so it will need to be set dynamically.
To do so uncheck the “private checkbox” next to the header in Bubble API Connector.
Toolbox plugin’s JS to Bubble element would make this possible. (You would modify the JavaScript so that the last step calls the JS to Bubble element’s function call with the value you need returned. See my video on this for a general introduction — will post shortly after I find the post!)
