OpenAI API in JupyterLite

README.md

OpenAI API in JupyterLite

join the discussion on Jupyter Discourse

Both of these examples require an API key, and neither really do anything at present.

You can drag them into just about any JupyterLite site, such as JupyterLite's own ReadTheDocs or demo.

OpenAI API in JupyterLite JS Knerel.ipynb

OpenAI API in JupyterLite Pyodide Kernel.ipynb

{
  "metadata": {
    "language_info": {
      "codemirror_mode": {
        "name": "python",
        "version": 3
      },
      "file_extension": ".py",
      "mimetype": "text/x-python",
      "name": "python",
      "nbconvert_exporter": "python",
      "pygments_lexer": "ipython3",
      "version": "3.8"
    },
    "kernelspec": {
      "name": "python",
      "display_name": "Python (Pyodide)",
      "language": "python"
    }
  },
  "nbformat_minor": 4,
  "nbformat": 4,
  "cells": [
    {
      "cell_type": "markdown",
      "source": "# Using the OpenAI API from the JupyterLite Pyodide Kernel\n\n> join the discussion on [Jupyter Discourse](https://discourse.jupyter.org/t/how-to-install-openai-npm-package-in-the-javascript-kernel-in-jupyterlite/19065)",
      "metadata": {}
    },
    {
      "cell_type": "markdown",
      "source": "## You need a key\n\nIf you don't have one, this isn't going to work at all.",
      "metadata": {}
    },
    {
      "cell_type": "code",
      "source": "OPEN_API_KEY = \"GET YOUR OWN KEY\"",
      "metadata": {
        "trusted": true
      },
      "execution_count": null,
      "outputs": []
    },
    {
      "cell_type": "markdown",
      "source": "## Get Modules\n\nThere's a lot of code needed, and some advanced hacks don't work in the JS compatibility layer WebWorker yet. [jspm.io](https://jspm.org/) provides a CDN with shims to get to something more like the documentation for [`importMap`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script/type/importmap)s.",
      "metadata": {}
    },
    {
      "cell_type": "code",
      "source": "import js\njs.eval(\"\"\"\nCDN = \"https://ga.jspm.io/npm\";\nimportScripts(`${CDN}:[email protected]/dist/es-module-shims.wasm.js`);\nimportShim.addImportMap({\n    \"imports\": {\n        \"openai\": `${CDN}:[email protected]/dist/index.js`\n    },\n    \"scopes\": {\n      \"https://ga.jspm.io/\": {\n        \"#lib/adapters/http.js\": `${CDN}:[email protected]/lib/adapters/xhr.js`,\n        \"axios\": `${CDN}:[email protected]/index.js`,\n        \"form-data\": `${CDN}:[email protected]/lib/browser.js`\n      }\n    }\n  });\n\"\"\")\nimportShim = js.importShim",
      "metadata": {
        "trusted": true
      },
      "execution_count": null,
      "outputs": []
    },
    {
      "cell_type": "markdown",
      "source": "## Main\n\nWith the above in place, top-level `await` should mostly work, with the following adapted from the upstream [documentation](https://github.com/openai/openai-node#usage).",
      "metadata": {}
    },
    {
      "cell_type": "code",
      "source": "API = await importShim('openai')",
      "metadata": {
        "trusted": true
      },
      "execution_count": null,
      "outputs": []
    },
    {
      "cell_type": "code",
      "source": "configuration = API.Configuration.new({\"apiKey\": OPEN_API_KEY})\nopenai = API.OpenAIApi.new(configuration)",
      "metadata": {
        "trusted": true
      },
      "execution_count": null,
      "outputs": []
    },
    {
      "cell_type": "code",
      "source": "await openai.createCompletion({\n    \"model\": \"text-davinci-003\",\n    \"prompt\": \"Hello world\",\n})",
      "metadata": {
        "trusted": true
      },
      "execution_count": null,
      "outputs": []
    }
  ]
}