A TypeScript module for querying OpenAI's API using fetch (a standard Web API)
instead of axios. This is a drop-in replacement for the official openai
module (which has axios as a dependency).
As well as reducing the bundle size, removing the dependency means we can query OpenAI from edge environments. Edge functions such as Next.js Edge API Routes are very fast and, unlike lambda functions, allow streaming data to the client.
The latest version of this module has feature parity with the official v3.3.0.
Update July 2023: The official
openailibrary will usefetchin v4, hopefully makingopenai-edgeredundant. You can try it in beta now, more info here: openai/openai-node#182
yarn add openai-edgeor
npm install openai-edgeEvery method returns a promise resolving to the standard fetch response i.e.
Promise<Response>. Since fetch doesn't have built-in support for types in
its response data, openai-edge includes an export ResponseTypes which you
can use to assert the correct type on the JSON response:
import { Configuration, OpenAIApi, ResponseTypes } from "openai-edge"
const configuration = new Configuration({
apiKey: "YOUR-API-KEY",
})
const openai = new OpenAIApi(configuration)
const response = await openai.createImage({
prompt: "A cute baby sea otter",
size: "512x512",
response_format: "url",
})
const data = (await response.json()) as ResponseTypes["createImage"]
const url = data.data?.[0]?.url
console.log({ url })To use with Azure OpenAI Service you'll need to include an api-key header and
an api-version query parameter:
const config = new Configuration({
apiKey: AZURE_OPENAI_API_KEY,
baseOptions: {
headers: {
"api-key": AZURE_OPENAI_API_KEY,
},
},
basePath: `https://YOUR_RESOURCE_NAME.openai.azure.com/openai/deployments/YOUR_DEPLOYMENT_NAME`,
defaultQueryParams: new URLSearchParams({
"api-version": AZURE_OPENAI_API_VERSION,
}),
})This module has zero dependencies and it expects fetch to be in the global
namespace (as it is in web, edge and modern Node environments). If you're
running in an environment without a global fetch defined e.g. an older version
of Node.js, please pass fetch when creating your instance:
import fetch from "node-fetch"
const openai = new OpenAIApi(configuration, undefined, fetch)This module also expects to be in an environment where FormData is defined. If
you're running in Node.js, that means using v18 or later.
cancelFineTunecreateAnswercreateChatCompletion(including support forfunctions)createClassificationcreateCompletioncreateEditcreateEmbeddingcreateFilecreateFineTunecreateImagecreateImageEditcreateImageVariationcreateModerationcreateSearchcreateTranscriptioncreateTranslationdeleteFiledeleteModeldownloadFilelistEngineslistFileslistFineTuneEventslistFineTuneslistModelsretrieveEngineretrieveFileretrieveFineTuneretrieveModel
Here are some sample
Next.js Edge API Routes
using openai-edge.
Note that when using the stream: true option, OpenAI responds with
server-sent events.
Here's an example
react hook to consume SSEs
and here's a full NextJS example.
import type { NextRequest } from "next/server"
import { Configuration, OpenAIApi } from "openai-edge"
const configuration = new Configuration({
apiKey: process.env.OPENAI_API_KEY,
})
const openai = new OpenAIApi(configuration)
const handler = async (req: NextRequest) => {
const { searchParams } = new URL(req.url)
try {
const completion = await openai.createChatCompletion({
model: "gpt-3.5-turbo",
messages: [
{ role: "system", content: "You are a helpful assistant." },
{ role: "user", content: "Who won the world series in 2020?" },
{
role: "assistant",
content: "The Los Angeles Dodgers won the World Series in 2020.",
},
{ role: "user", content: "Where was it played?" },
],
max_tokens: 7,
temperature: 0,
stream: true,
})
return new Response(completion.body, {
headers: {
"Access-Control-Allow-Origin": "*",
"Content-Type": "text/event-stream;charset=utf-8",
"Cache-Control": "no-cache, no-transform",
"X-Accel-Buffering": "no",
},
})
} catch (error: any) {
console.error(error)
return new Response(JSON.stringify(error), {
status: 400,
headers: {
"content-type": "application/json",
},
})
}
}
export const config = {
runtime: "edge",
}
export default handlerimport type { NextRequest } from "next/server"
import { Configuration, OpenAIApi, ResponseTypes } from "openai-edge"
const configuration = new Configuration({
apiKey: process.env.OPENAI_API_KEY,
})
const openai = new OpenAIApi(configuration)
const handler = async (req: NextRequest) => {
const { searchParams } = new URL(req.url)
try {
const completion = await openai.createCompletion({
model: "text-davinci-003",
prompt: searchParams.get("prompt") ?? "Say this is a test",
max_tokens: 7,
temperature: 0,
stream: false,
})
const data = (await completion.json()) as ResponseTypes["createCompletion"]
return new Response(JSON.stringify(data.choices), {
status: 200,
headers: {
"content-type": "application/json",
},
})
} catch (error: any) {
console.error(error)
return new Response(JSON.stringify(error), {
status: 400,
headers: {
"content-type": "application/json",
},
})
}
}
export const config = {
runtime: "edge",
}
export default handlerimport type { NextRequest } from "next/server"
import { Configuration, OpenAIApi, ResponseTypes } from "openai-edge"
const configuration = new Configuration({
apiKey: process.env.OPENAI_API_KEY,
})
const openai = new OpenAIApi(configuration)
const handler = async (req: NextRequest) => {
const { searchParams } = new URL(req.url)
try {
const image = await openai.createImage({
prompt: searchParams.get("prompt") ?? "A cute baby sea otter",
n: 1,
size: "512x512",
response_format: "url",
})
const data = (await image.json()) as ResponseTypes["createImage"]
const url = data.data?.[0]?.url
return new Response(JSON.stringify({ url }), {
status: 200,
headers: {
"content-type": "application/json",
},
})
} catch (error: any) {
console.error(error)
return new Response(JSON.stringify(error), {
status: 400,
headers: {
"content-type": "application/json",
},
})
}
}
export const config = {
runtime: "edge",
}
export default handler
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent