Keyをユーザーに準備してもらう仕組みになっています。(GPT-3.5が安いとはいえ、1クリックごとにAPIアクセスするサービスはマズかった・・・みたいな仕様の反省点はまた別の機会に。)ChatGPTとリバーシで遊べるサイトを作りました!ルール判定も、勝敗判定も、ChatGPT任せです。勝てたらご報告ください。2023このサイトを作るために何をしたのか、ChatGPTを利用したWebサイトを作りたい人のために記録を残しておきます。この記事では、セキュリティリスクや費用に対しても最低限の配慮しかしていません。エラー処理も言わずもがな。遊びの域を出たら、もっと真面目にやりましょう。簡単なHTMLとJavaScriptの読み書きができる大枠はChatGPT(GPT-4)に書いてもらえますが、ちょっとしたバグ修正や機能変更のために、多少は読み書きできないと不便です。AWSちょっとわかる今回使うのはLambdaだけですが、AWSの最低限の知識は必要です。(例えば、IAMロールなどの説明は省いています。何はともあれ、動くものを作るまずは何も考えず、動くものを作りましょう。Keyはこちらのページから取得できます。GPT-4にChatGPTと、リバーシのゲームをプレイできるWebサイトを作ってください。プレイヤーが先手を打ち、OpenAIのAPIを使ってChatGPTに先手の位置とコメントを出力させます。html、css、jsを別々に出力してください。みたいにザックリ投げるだけでも、それっぽいものを出力してくれます。そこから「これも実装して、あれも実装して」とお喋りしながら、1時間ちょっとで動く物ができます。(ここの速度感が凄すぎる!!!)残念なことに、GPT-4はOpenAIのAPIをtext-davinci-003までしか知りません。GPT-3.5にアクセスするには、以下のようなコードに差し替える必要があります。ドキュメントはこちら。Keyをユーザーに入力してもらうバージョンは、この時点のコードを元に公開しています。Keyを隠さなければなりません。Keyを隠さないといけないの?」の説明を書こうかと思ったのですが、その説明がいる人向けに記事を書いていたら、長さが5倍になってしまうので省きます。言わずもがなですが、プロンプトをそのままPOSTで送るとかもやめてください。分かってる人だけ続きを読んでください。何はともあれLambda関数を作ります。18.x、arm64で。armの方が安いらしいですよ。Keyを環境変数に入れちゃいましょう。環境変数に、OPENAI_API_KEYという名前で保存します。コードを書く!このコードも大体ChatGPTに書いてもらったので、変なところあればツッコミください。変更したいところはChatGPTに聞きましょう。JavaScriptにもnode.jsにも詳しくないのでノリで書いてます。試しに、「任意の国の料理を教えてくれるサービス」を作るとします。parametersからname(国名)を受け取り「${name}の料理を教えて」とGPT-3.5に聞いて結果を返すというシンプルながら必要な要素は抑えてるであろうコード例です。"アクセスが集中しています。200を返すなっていいたいよね、わかるよ。\"日本\"}"}こんな感じのJSONをテストデータとして登録して実行してやると・・・タイムアウトします。タイムアウトを30秒ぐらいにしてやります。URLsなんていう便利な物があるらしいですね。関数URLからURLを生成してやります。console.log(data);}こんな感じでアクセスできます。limitsを設定しようこのままサービスインすると、青天井にOpenAIのAPIが使われてしまいます。(実はデフォルトでは$120のリミットはありますが。limitsの設定ページで上限を設定しておきましょう。この上限、ピッタリそこで止まることは保証されていないので余裕を持って設定しましょう。(自分は$5ほどオーバーしてました。)また、$120の上限を上げたいときはこちらのページから申請できます。(1週間ぐらいかかるらしい。limitsに注意しようOpenAIのAPIは、1分間に呼び出せる回数に制限があります。自分はTPMのlimitにめちゃくちゃ引っかかりましたが、どっちに引っ掛かるかはサービスの性質によりそうですね。これも申請すれば上限を上げることができます。API悪用対策サンプルコードは文字列をそのまま送っちゃってますが、プロンプトインジェクションには気をつけて最低限のパラメーターを送ったり、Lambda側でちゃんと検証したりしましょう。「任意の国の料理を教えてくれるサービス」でいえば、入力は国コードとし、Lambda側で国コードであることを検証して、それを正式名称に変換、プロンプトにする。Logsからログを漁ろう!console.logがそのまま垂れ流されます。利用した、面白いサービスを作りましょう!・・・と、気軽には言えないぐらいお金が溶けてしまうので、マネタイズも大事ですね。(1)kyubuns.dev引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。