Integration with Open AI API not working (401 Unauthorized)

I have integrated the OpenAI API in my Bubble app but I am encountering a 401 Unauthorized error when trying to make the API call in the workflow, even though everything appears to be set up correctly.

Here’s what I’ve tested and configured:

  1. API Key: I’ve verified that the API key I’m using is valid and working in cURL (tested successfully in the terminal with with different user content (not dynamic value)
  2. API Call in Bubble: I’ve set up the API in Bubble using the POST method, passing the appropriate headers, including Content-Type: application/json and Authorization: Bearer YOUR_API_KEY. The body is configured correctly, with the required parameters (e.g., model, messages, temperature, max_tokens).
  3. Testing cURL: When I run the same API call in the terminal using cURL with the exact same API key and body, it works perfectly and I get a response from OpenAI.
  4. Problem in Bubble Workflow: When executing the workflow in Bubble, the API call fails with a 401 Unauthorized error, indicating that the API key is either missing or incorrect, even though it’s correctly configured in Bubble.
  5. Dynamic Values: I’m passing dynamic values (user’s input) into the message body, and I can see the correct values being passed through in the debug logs. However, the message from OpenAI is not being returned or saved into the database as expected. (I can see my own message in the database, but not the OpenAI answer)

Despite everything working in cURL, I’m still unable to get a successful response in Bubble, and the error indicates an issue with authentication. I’ve checked and re-checked the API key, headers, and formatting but can’t pinpoint what’s causing the failure. Could someone show me the right direction?

Your JSON markup for the API call is invalid hence it can’t initiate an API call to OpenAI servers.

for dynamic input field markups always try to use plain text letter or words, here you used an apostrophe “Input Message’s values” - the apostrophe is causing the JSON syntax to brake and cause issues.

Tips:

I’d recommend never use an apostrophe in dynamic value insert markups, use underscores, hyphens or choose different words that get the help you remember.

Also, always make your headers private, as they are sensitive for connection between services, and in the wrong hands can cause harm to your app/business

Thanks for the reply. I changed headers to private. But when I get rid of the apostrophes then there’s another error coming up:

I assume you got rid of the side ones as well, just use this exact thing : “<input_message_value>” - with the apostrophe on the sides as these are important and identify itself as value containers, any apostrophe used inside these value container in the dynamic words breaks the API syntax and hence your api call doesn’t work.

Just use this: “content”: “<input_message_value>”

or this “content”: “”

and you’ll understand what I said above

@sparklsophie You should be using the following in your API call.

"content": <message>

In the API call, you need to fill the message parameter with Input’s value:formatted as JSON safe.

That ensures that no matter what the user inputs, the message JSON will always be valid.

To pass a variable to an API call, you create a parameter (like you have done for one called ‘Input Message’s value’. When you use the API call action, you need to enter the dynamic data there. I think you might’ve misunderstood how passing dynamic data to API calls works which is why you’ve hit a wall :slight_smile:

Hi, also received the same error although the api is ok and the following json looks like this:

Your content parameter should be “say this is a test!” (with quotation marks.

When using it in an action, use Arbitrary text:formatted as text. That will add the quotation marks around your text.

1 Like

Thanks but the issue still remains. Wondering what else did i forget to add…

Header of Content-Type with the value set to application/json.

Otherwise, send the error message here

Forgot to add the bearer keyword before the token, but the issue I’m getting now (I’m aware about the error code 429, but still mysterious for me how I exceeded the rate limit ):

Read the docs at the link provided.

Problem solved