Robust JSON validation in bubble for OpenAI API call

Hello Bubble Community,

I’m building a document generator app that interacts with the OpenAI API to produce custom policies based on user input. Users provide data through various text input fields (e.g., company name, business activities), which can contain any range of characters, including special ones like quotes and newlines. This user-provided data is then used to construct a JSON payload for the API call.

  • Purpose of the API Call:The API call takes the user input and uses it to generate a tailored document. The inputs are sentences and phrases that describe aspects of the user’s company and its information security practices.

  • Issue Encountered:I’ve encountered JSON invalid errors (error 404) when the user input includes special characters (my API call usually works). To combat this, I’ve tried using Bubble’s :formatted as JSON-safe operation on the input fields. It appears that this fix leads to a malformed JSON and an invalid API call.

  • Example Error:Invalid JSON error, usually indicating a parse error where it’s expecting EOF, ‘}’, ‘:’, ‘,’, ‘]’, got ‘undefined’.

I believe applying:formatted as JSON-safe to each input field would solve the issue, but this systematically leads to HTTP 400 error. I suspect the function may be misused, or there’s a better way to sanitize the inputs that I’m not aware of. Here are the server logs:

image

Could someone advise on the best practices for sanitizing user input in Bubble for JSON payloads… in my specific use case? Specifically, how can I ensure that the dynamic data entered by users is automatically processed so that it doesn’t disrupt the JSON structure (so the doc generation process will work), while also keeping the process efficient and not overly complex?

Any insights, workflows, or plugins that could help with this situation would be greatly appreciated. I aim for a solution that is automated and reliable, with a success rate of 99.99%.

Below some screenshots of my input fields and API call and error in Json inspector.

User inputs

Formatted json safe
image

How it looks in server logs
image

Error

Thank you for your time and assistance!

Hi! I think the problem here is that you are formatting the individual inputs as JSON safe, whereas what you need to be doing is formatting the entire concatenated string value that is at the content key as JSON safe.

So it would look something like:
(I represent Input Company’s Name value, a company located in…):formatted as JSON safe

with only one formatted as JSON safe at the end. Let me know if that works/makes sense.

2 Likes

The above is correct.

Your content key should be “content”: Arbitrary text:formatted as JSON-safe

In the arbitrary, put whatever you want and nothing needs formatting as JSON-safe as it will be formatted as JSON safe once everything put together inside the arbitrary text.

1 Like

Immense thank you both for your help. Currently testing the fix. Will tell you when it’s done. But you just made my app really better. So, big thanks.

I confirm I applied exactly this and it exactly worked : )

Well done!

This topic was automatically closed after 70 days. New replies are no longer allowed.