2c:null 2d:["$","title",null,{"children":"OpenAI API | Oliver Steele | Observable"}] 32:Ta58,## Usage In order to run these examples, you need an OpenAI API Key. If you have an OpenAI account, you can get an API key from [this page](https://platform.openai.com/account/api-keys), where it is also called a "secret key". There are three ways to supply the API key to the functions in this notebook: ### Method 1. Supply the API as an argument to each function call Supply the API key as an argument to each of the API functions. For example: ```js completions("List ten ways of using ObservableHQ.", { api_key: {"sk-XXXXXXXX"} }) ``` where `sk-XXXXXXXX` is your OpenAI API Key.

**Security warning**: Don't include your API key in a public notebook. If you do, anyone can extract your key and use it. If you have a free account, this will blow through your OpenAPI quota. If you have a paid account, it will cost you money. In either case, if someone uses your key in ways that violate OpenAI's service terms, you might also lose access to OpenAI.

Observable Pro users: Instead of including the API key in the text of the notebook, you can add it as an [ObservableHQ secret](https://observablehq.com/@observablehq/secrets?collection=@observablehq/getting-data-in-and-out): E.g. instead of writing `OPENAI_API_KEY = "sk-XXXXXXXX"` as above, you can use `OPENAI_API_KEY = Secret("OPENAI_API_KEY")`.

### Method 2. Inject the API in the import statement As an alternative to passing the API Key as a parameter to each function call, you specify it in the import statement. For example: ```js OPENAI_API_KEY = "sk-XXXXXXXX" ``` ```js import { completions } with { OPENAI_API_KEY as API_KEY } from "@osteele/openai-api" ``` ```js completions("List ten ways of using ObservableHQ.") ``` ### Method 3. Use `@tmcw/secret` Import `viewof openaiApiKey` from this notebook, and include `viewof openaiApiKey` in a cell: ```js import { completions, viewof openaiApiKey } from "@osteele/openai-api" ``` ```js viewof openaiApiKey ``` The first time that you run the notebook, enter the API key into the provided field, and save it. It will be saved into [window.localStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) with key `OPENAI_API_KEY`. Notebooks from this site that you run in your own browser will have access to this value. Pages from other sites do not. The first time that you save the API key, you may need to reload the page in order for the OpenAI functions to see the key. See the [@osteele/openai-api-example](https://observablehq.com/@osteele/openai-api-example) notebook as an example of this method.33:T4bd,### Completions `completions` is an asynchronous function that, given a prompt, will return one or more predicted completions. ```js import {completions} from "osteele/openai-api" completions("Ten ways of using ObservableHQ:") ``` Parameters: - `prompt` (required): a string or array of string - `options`: an object - `api_token`: the OpenAI API token - `extract_singleton` (default true): if this is true and a single choice is returned, return it as a string. Specify `false` to return a array with length 1 instead. - The other property names of this object are the parameter names in , with these exceptions to match the GPT-3 Playground: - `model` defaults to `"text-davinci-003"` - `max_tokens` defaults to 512 - `temperature` defaults to 0.2 These `model` and `max_tokens` defaults are the more impressive than the API defaults (and match the GPT-3 Playground defaults), but they are more expensive and use up your budget more quickly than a smaller model and/or a lower token value. Returns: - If `options.extract_singleton is true and `options.n` is 1 (the defaults), a string - Otherwise, an Array of strings 34:[] 30:{"id":"53695025f69549e5","slug":"openai-api","title":"OpenAI API","thumbnail":"30e60ff2592d489a7a516e92b05650999716e4dbf55fe3beb5639b53a76147e3","access_level":"public","create_time":"$D2023-02-11T17:29:12.111Z","update_time":"$D2023-02-22T13:29:32.618Z","view_time":null,"first_public_time":"$D2023-02-12T16:22:43.204Z","fork":false,"stars":7,"starred":false,"owner":{"type":"team","id":"65287140888f0925","login":"osteele","name":"Oliver Steele","avatar_url":"https://avatars-next.observableusercontent.com/380a9e072924fdaf03d8741574485948468768edaa13895c476cf9ca6ea6bbb2","tier":"starter_2024"},"version":526,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"0f0f7ed81f6a7b3b","login":"osteele","name":"Oliver Steele","avatar_url":"https://avatars-next.observableusercontent.com/380a9e072924fdaf03d8741574485948468768edaa13895c476cf9ca6ea6bbb2","tier":null}],"members":[{"type":"individual","id":"0f0f7ed81f6a7b3b","login":"osteele","name":"Oliver Steele","avatar_url":"https://avatars-next.observableusercontent.com/380a9e072924fdaf03d8741574485948468768edaa13895c476cf9ca6ea6bbb2","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":7,"collection":{"id":"778d51b150595ef5","slug":"openai","title":"OpenAI","owner":{"id":"65287140888f0925","login":"osteele","name":"Oliver Steele"}},"type":"notebook","body":{"title":"OpenAI API","cells":[{"id":59,"value":"# OpenAI API\n\nThis notebook provides access to the [OpenAI API](https://platform.openai.com/docs/introduction/overview) from within Observable.\n\nSee [https://observablehq.com/@osteele/openai-api-example](https://observablehq.com/@osteele/openai-api-example) for examples.\n\n

**Note**: This notebook is designed is on ease-of-use for the simplest cases. The functions that it defines don't return all the information that the OpenAI API does. If you want more functionality, consider using the [OpenAI Node.js npm Library](https://github.com/openai/openai-node) instead. You can use Observable's `import` statement to import that library directly, or use the [@osteele/openai-wrapper](https://observablehq.com/@osteele/openai-wrapper) notebook, which wraps that module.

\n\nThe core function was expanded from code that Andy Reagan posted to Observable Community Slack.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":70,"value":"$32","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":313,"value":"$33","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":323,"value":"### Text Edits\n\n`text_edits` is an asynchronous function that, given an input text and an instruction, returns an edited version of the input text.\n\n```js\nimport {text_edits} from \"osteele/openai-api\"\ntext_edits(\"What day of the wek is it?\")\n```\n\nParameters:\n\n- `prompt` (required): a text description of the desired image(s)\n- `options`: An object.\n - `api_token`: the OpenAI API token\n - `extract_singleton` (default true): if this is true and a single choice is returned, return it as a string. Specify `false` to return a array with length 1 instead.\n - The other properties of _options_ are the parameters listed in , with these exceptions:\n - `model` defaults to `\"text-davinci-edit-001\"`\n - `instruction` defaults to `\"Fix the spelling mistakes\"`\n\nReturns:\n\n- If `options.extract_singleton is true and `options.n` is 1 (the defaults), a string\n- Otherwise, an Array of strings\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":367,"value":"### Code Edits\n\n`code_edits` is an asynchronous function that, given an instruction and an optional input text, returns code that is guided by the instruction.\n\n```js\nimport {code_edits} from \"osteele/openai-api\"\ncode_edits(\"print a list of string lengths\", { input: \"def print_lengths\" })\n```\n\nParameters:\n\n- `prompt` (required): a text description of the desired image(s)\n- `options`: An object.\n - `api_token`: the OpenAI API token\n - `extract_singleton` (default true): if this is true and a single choice is returned, return it as a string. Specify `false` to return a array with length 1 instead.\n - The other properties of _options_ are the parameters listed in , with this exception:\n - `model` defaults to `\"code-davinci-edit-001\"`\n\nReturns:\n\n- If `options.extract_singleton is true and `options.n` is 1 (the defaults), a string\n- Otherwise, an Array of strings","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":317,"value":"### Images\n\n`images` is an asynchronous function that, given a prompt, creates one or more images.\n\n~~~javascript\nimport {images} from \"osteele/openai-api\"\nimages(\"A cute baby sea otter\", { n: 4, size: 256 })\n~~~\n\nParameters:\n\n- `prompt` (required): a text description of the desired image(s)\n- `options`: An object.\n - `api_token`: the OpenAI API token\n - `extract_singleton` (default true): if this is true and a single choice is returned, return it as a string. Specify `false` to return a array with length 1 instead.\n - The other properties of _options_ are the parameters listed in . Additionally, `size` may be specified as a number e.g. `256` as an abbreviation for `\"256x256\"`.\n\nReturns:\n\n- If `options.extract_singleton is true and `options.n` is 1 (the defaults), a URL string\n- Otherwise, an Array of URL strings","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":256,"value":"#### An recipe for displaying multiple images\n\n~~~javascript\nimage_urls = await images(\"A cute baby sea otter\", { n: 4, size: 256 })\n~~~\n\n~~~javascript\nhtml`

$\\{image_urls.map(\n (url) => `

`\n)}

`\n~~~","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":301,"value":"## Implementation","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":508,"value":"### Key management","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":489,"value":"import {secret} from \"@tmcw/secret\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":380,"value":"// The importing notebook can import this notebook with a `with` statement that initializes this value. See the instructions at the top of this notebook.\nAPI_KEY = undefined","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":482,"value":"viewof openaiApiKey = secret(\"OPENAI_API_KEY\", {\n description:\n \"This is an OpenAI API token whose value is only available to your notebooks.\",\n submit: \"Save OpenAI API key\"\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":494,"value":"viewof openaiApiKey","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":510,"value":"### API Wrappers","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":202,"value":"async function completions(prompt, options = {}) {\n const defaults = {\n extract_singleton: true,\n // these override the default API parameters to match the Playground settings:\n max_tokens: 256,\n temperature: 0.7,\n };\n const { extract_singleton, ...params } = { ...defaults, ...options };\n const data = await fetchOpenAI(\"completions\", {\n model: \"text-davinci-003\",\n prompt,\n ...params\n });\n const choices = data.choices.map(c => c.text.trim());\n return extract_singleton && choices.length === 1\n ? choices[0]\n : choices;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":104,"value":"async function text_edits(input, options={}) {\n const defaults = {extract_singleton: true};\n const { extract_singleton, ...params } = { ...defaults, ...options };\n const data = await fetchOpenAI(\"edits\", {\n input,\n model: \"text-davinci-edit-001\",\n instruction: \"Fix the spelling mistakes\",\n ...params\n });\n const choices = data.choices.map(c => c.text.trim());\n return extract_singleton && choices.length === 1\n ? choices[0]\n : choices;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":350,"value":"async function code_edits(instruction, options) {\n const defaults = {extract_singleton: true};\n const { extract_singleton, ...params } = { ...defaults, ...options };\n const data = await fetchOpenAI(\"edits\", {\n instruction,\n model: \"code-davinci-edit-001\",\n ...params\n });\n const choices = data.choices.map(c => c.text.trim());\n return extract_singleton && choices.length === 1\n ? choices[0]\n : choices;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":116,"value":"async function images(prompt, options) {\n const defaults = {extract_singleton: true};\n const {extract_singleton, size, ...params} = {...defaults, ...options};\n const data = await fetchOpenAI(\"images/generations\", {\n prompt,\n size: typeof size === 'number' ? `${size}x${size}` : size,\n ...params\n });\n const urls = data.data.map(d => d.url);\n return extract_singleton && urls.length === 1\n ? urls[0]\n : urls;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":519,"value":"### Helper","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":92,"value":"async function fetchOpenAI(endpoint, parameters) {\n const { api_key, ...params } = {\n ...parameters,\n api_key: API_KEY ?? openaiApiKey\n };\n if (!api_key) {\n throw new Error(\n \"In order to inport @osteele/openai-api, you must save your OpenAI API key in the browser, or import the notebook using a `with` statement. See that notebook for usage instructions.\"\n );\n }\n const response = await fetch(`https://api.openai.com/v1/${endpoint}`, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n Authorization: `Bearer ${api_key}`\n },\n body: JSON.stringify(params)\n });\n const data = await response.json();\n if (response.status >= 400) {\n throw new Error(data.error.message);\n }\n return data;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W34","stdlib":"1","titling":"auto"}} 31:"$30:body"