Integrating Algolia - How Do I Send Headers Through Dropsource To The API?


I’ve create a spec file in spotlight.

I need to pass headers from drop source to the api in order to authenticate.

How do i do this?


Hi Justin,

We don’t support the ability to directly control request header parameters like you would with the other parameter types. However, if your API endpoints use certain standard auth schemes (like basic, API key, or OAuth), then you can define those in the Swagger, provide values in the Dropsource Editor, and Dropsource will handle inserting the necessary headers for you. Does your login endpoint require special header values? Or do you just need the ability to attach a header token to other API requests?


I pasted your response inside of Spotlight’s support and they replied back with the following when i was asked how to define something in the Swaggar as you recommended.

@seanhoots has integrated Algolia some how, using a swaggar I guess… How am i supposed to do this?

"This makes sense why you were getting a 403 even though you had your authentication set in the headers correctly.

It is possible to model API keys inside of your OpenAPI Specification (formerly known as Swagger) document. But I don’t think this is going to work with the Algolia API like you want it to.

I checked out their docs, and it looks like this is the way you are suppose to do authentication:

I don’t see any mention of authentication in other ways than headers. So sadly, you might have to find another way of using this API in your project that allows you to set request header parameters ."


I haven’t created an algolia swagger in dropsource. I tested Algolia with bubble using the Bubble API Connector.

But you you should be able to define the algolia headers as api keys in stoplight and they will be available in dropsource.

See this


So helpful! Thank you @seanhoots for adding in here.


So you still used Bubble to relay the information to/from Algolia?

Doesn’t that slow things down and defeat the purpose of their fast API?


I actually don’t use algolia. I only tried it and it was for purely web application all in bubble not a bubble-dropsource app.

Actually i’ve done this in dropsource before when i did the [autocomplete search] demo ([Tips and Tricks] Autocomplete search box dropdown).


Thanks for clarifying @seanhoots… I thought you had integrated it into a DS app. I’m curious if anyone has. I haven’t myself. I’m reaching out to engineering to see if we know and if anything I’ll try myself to see if it works. Looks like the trick is in the headers though. @justincrabbe it looked like in your POSTMAN call that you had your app id in the header but didn’t do the same in DS like you did with the API Key. Do you want to do the same for the app id and see if that is the silver bullet here?


Here is the reply from Spotlight support on this when I asked them:


Taylor BarnetttaylorCommunity Engineer


Hey again!

Did you try it the way Dropsource suggested? Because it sounds like you’ll never be able to pass it in as a header value. Only through the security section in OpenAPI like I shared in the last post.

Sadly, neither of these are running through Stoplight, so we won’t be of much use. I can only help you set it in your OpenAPI document.


Not sure why you’re still not getting this to work. I just tried it and it works perfectly.
You simply just need to add the headers as api keys as i pointed out above.

Here is a quick rundown with stoplight.

  1. Use the security to create the two headers as shown below:

  2. Create your algolia endpoint. E.g. search index like below. Remember the search index endpoint has a path parameter, e.g. here i’m calling it indexName. So create a path parameter and use it in the endpoint url (put it inside curly brackets as shown).

  3. Finally define your body and response. This will depend on the algolia endpoint. For search index you just need to define a query object which will be the search string. The response will depend on the structure of your data (records). You can model that by using postman to make the call and copy the response and use it in stoplight to define the response.

Here is a quick demo using the sample actors index from algolia

NB the marched text highlighting is not a default behavior but something i built (don’t ask me how).

Simulator link


@wade and @justincrabbe sorry guys i forgot i had built an algolia swagger before when i was doing the autocomplete. I thought i did this in bubble instead. My bad.


Awesome share @seanhoots! Thanks for taking the time here and showing so much detail!!! @justincrabbe looks like a great guide for you spelled out right here.


I had it set to a GET call inside of spotlight - so i changed it to POST like your screen shot (also like my postman) thinking that may be the issue.

Now I’m seeing a ‘bad request’ 400 error:

My first time integrating a 3rd party api using spotlight, algolia, and also dropsource - forgive my lack of knowledge and thank you for the help!!!


@seanhoots I’m still not able to sort this out despite being at it weeks.

Is there any chance you can send me the swaggar file that you are using?


You can’t use my swagger file as my index (table) is different from yours so the response object definition is going to be totally different.
Every algolia swagger is going to be different because of the different indexes.
I’ve already explained in detail step by step with snapshots exactly what I did so there is nothing more I can add to help.