My OpenAI link is broken

Hi All,

I have an app that we built around 18 months ago. I’d not been in the app for about 6-7 months, and when I try to use the core functionality. I get the error messages below. I think a change has happened with OpenAI API Calls. But, I do not know the change. And I’m in a bit of a pickle here… as I need the app to work :frowning: . Would really appreciate any help on this.

The app is sending an image to OpenAi (the API key is valid). OpenAI reads the text from the chart, and gives it back to my app. Populating a dropdown.

The error:

Error: SplitGPToutput (JS transformer)

Error:Cannot read properties of null (reading 'split')
splitGPTOutput

in splitGPTOutput, line 2(splitGPTOutput)
from splitGPTOutput.funcBody update(splitGPTOutput)
from gptVisionFindIssues.data update(gptVisionFindIssues)

▶
in gptVisionFindIssues.trigger()(splitGPTOutput)
in loadImage success event handler(loadImage)
from loadImage response(loadImage)

▶
in loadImage.trigger()(splitGPTOutput)
in run script(image5)
in image5[0] click event handler(image5)
from user interaction

Error: GPTVisionFindIssues (Query)

▶
gptVisionFindIssues failed (3.152s):{"status":400,"message":"","error":{"code":500,"message":"The server had an error processing your request. Sorry about that! You can retry your request, or contact support@openai.com if you keep seeing this error.","param":null,"type":"cr_error"}}
gptVisionFindIssues

from gptVisionFindIssues response(gptVisionFindIssues)

▶
in gptVisionFindIssues.trigger()(gptVisionFindIssues)
body: undefined
additionalScope: undefined
triggeredById: "loadImage"
environment: "production"
in loadImage success event handler(loadImage)
from loadImage response(loadImage)

▶
in loadImage.trigger()(gptVisionFindIssues)
fileId: undefined
pageSize: undefined
pageNumber: undefined
additionalScope: {selectedImage: "159568fd-f343-4549-b23e-7def77f3c3ae"}
triggeredById: "image5"
environment: "production"
in run script(image5)
in image5[0] click event handler(image5)
from user interaction

Code: SplitGPTOutputTransformer

var found_issues_list = {{gptVisionFindIssues.data.choices[0].message.content}}.split("\n")

return found_issues_list

Code: GPTVisionFindIssues

{
  "model": "gpt-4o",
  "messages": [
    {
      "role": "user",
      "content": [
        {
          "type": "text",
          "text": "This is an image of a 2d chart. There are a lot of sentences in the chart. Give me a list of all the sentences. Only output the sentences and no other text. Do not number the sentences."
        },
        {
          "type": "image_url",
          "image_url": {
            "url": "data:image/jpeg;base64,{{loadImage.data.base64Data }}"
          }
        }
      ]
    }
  ],
  "max_tokens": 300
}

Screenshot: GPTVisionFindIssues

Hi @maillme!

Tricky situation but I have some suggestions that might help. It seems that OpenAI updated their API and now we need to update your query so that it works with their new format.

1. You’re calling the old OpenAI endpoint (/v1/chat/completions)

The model gpt-4o (and all vision-capable models) now use:

POST https://api.openai.com/v1/responses

The legacy /v1/chat/completions route does not support images in this structure.


2. You’re using the old “messages” format

The new API expects an input array, not messages.
Vision content goes inside that array.

Example new format:

{
  "model": "gpt-4o",
  "input": [
    {
      "role": "user",
      "content": [
        { "type": "text", "text": "Your prompt here" },
        {
          "type": "input_image",
          "image_url": {
            "url": "data:image/jpeg;base64,{{ loadImage.data.base64Data }}"
          }
        }
      ]
    }
  ]
}

:white_check_mark: How to fix your Retool query

Fix #1 — Change the endpoint

In the Resource settings, replace:

https://api.openai.com/v1/chat/completions

with:

https://api.openai.com/v1/responses

Fix #2 — Replace your entire body with this

{
  "model": "gpt-4o",
  "input": [
    {
      "role": "user",
      "content": [
        {
          "type": "text",
          "text": "This is an image of a 2d chart. There are a lot of sentences in the chart. Give me a list of all the sentences. Only output the sentences and no other text. Do not number the sentences."
        },
        {
          "type": "input_image",
          "image_url": {
            "url": "data:image/jpeg;base64,{{ loadImage.data.base64Data }}"
          }
        }
      ]
    }
  ],
  "max_tokens": 300
}

Let me know if this works for you!