Nuxt3 から ChatGPT を叩く

よくある ChatGPT を叩くだけのサイトを作ってみる。

環境構築などは前回の記事を参照。 daichan4649.hatenablog.jp

/pages/index.vue

gist.github.com

/server/api/chatgpt.post.ts

gist.github.com

nuxt.config.ts

gist.github.com

.env

gist.github.com

ここまで実装したらデプロイ。

yarn build
npx firebase deploy

ポイント

.env へのアクセス

• nuxt.config.ts で .env を読み込む
• 各ソースでは useRuntimeConfig() を利用して読み込む

// nuxt.config.ts
  runtimeConfig: {
    openaiApiKey: process.env.OPENAI_API_KEY,
    public: {}
  },

簡単🙃