OpenAI Images API

In this example, you will use Skapi to call the OpenAI Images API securely.

First, we review the OpenAI API request format. Then we build the same request with clientSecretRequest().

Prerequisites

1. Create an OpenAI account and get your API secret key from platform.openai.com.
2. Save your OpenAI API secret key on the Client Secret Key page in Skapi.

For this example, save the key with the name openai.

You will use this name as clientSecretName in the request.

Understanding the API call

According to the API documentation, the endpoint is:

POST https://api.openai.com/v1/images/generations

This means the request uses POST to https://api.openai.com/v1/images/generations.

The curl example looks like this:

curl https://api.openai.com/v1/images/generations \
  -H "Content-Type: application/json" \
  -H "Authorization: Bearer $OPENAI_API_KEY" \
  -d '{
    "model": "gpt-image-1.5",
    "prompt": "A cute baby sea otter",
    "n": 1,
    "size": "1024x1024"
  }'

From this example, the request needs these headers:

• Content-Type: application/json
• Authorization: Bearer $OPENAI_API_KEY

The request body should include fields such as model, prompt, n, and size.

$OPENAI_API_KEY is a placeholder for your OpenAI secret key.

Because secrets must not be exposed in frontend code, use clientSecretRequest() and pass Bearer $CLIENT_SECRET instead:

Form

<form onsubmit="skapi.clientSecretRequest(event).then(r=>console.log(r))">
  <input name="clientSecretName" hidden value="openai">
  <input name="url" hidden value="https://api.openai.com/v1/images/generations">
  <input name="method" hidden value="POST">
  <input name="headers[Content-Type]" hidden value='application/json'>
  <input name="headers[Authorization]" hidden value="Bearer $CLIENT_SECRET">
  <input name="data[model]" hidden value="gpt-image-1.5">
  <input name="data[n]" hidden type='number' value="1">
  <input name="data[size]" hidden value="1024x1024">
  <textarea name='data[prompt]' required>A cute baby sea otter</textarea>
  <input type="submit" value="Generate">
</form>

JS

skapi.clientSecretRequest({
    clientSecretName: 'openai',
    url: 'https://api.openai.com/v1/images/generations',
    method: 'POST',
    headers: {
        'Content-Type': 'application/json',
        Authorization: 'Bearer $CLIENT_SECRET'
    },
    data: {
        model: "gpt-image-1.5",
        "prompt": "A cute baby sea otter",
        n: 1,
        size: "1024x1024"
    },
    onResponse(result) {
        console.log(result);
    }
})

The example above shows how to build request headers and body data for a secure OpenAI API call. Use $CLIENT_SECRET in the Authorization header and set clientSecretName to openai, which is the key name saved in your Skapi dashboard.

When the request runs, Skapi replaces $CLIENT_SECRET with your stored secret key and returns the response from the OpenAI API via the onResponse callback.