🔍

ChatGPT APIでJSON出力させてリンク集を作らせてみた

2023/03/24に公開

ChatGPTが流行ってます。私も流行りに乗って、個人開発してるリンク集共有サービス「Linksh」に取り入れてみましたが

AIはリンク集を作るのは苦手

という答えに落ち着きました。

https://www.youtube.com/watch?v=IbgA2q7S_mg

何が苦手なの

  • 紹介してくれるけどnot foundが多い

これに尽きます

おそらく原因は

  • AIはリンク先が生きてるかどうかまで見ない
  • 情報が2021年までのものなので生きているページが少ない

ちなみにどういう仕組かと言うと、テキストをformからsubmitしてChatGPT APIに処理を加えます。

例えば、「アメリカの代表的な料理のレシピを教えてほしい」というのを送るとjsonが返ってくるようにします。

[
    {
        "url": "https://www.allrecipes.com/recipe/218997/classic-hamburger/",
        "title": "クラシックハンバーガーのレシピ|オールレシピ",
        "description": "ジューシーで肉汁たっぷりなクラシックハンバーガーのレシピ。パティにはお好きな肉を選んで!バンズはハンバーガーバンズを用意するか、白いロールパンでも代用OK。必要な材料は最低限しかないので、とっても簡単に作れます。"
    },
    {
        "url": "https://www.food.com/recipe/chicken-fried-steak-4787",
        "title": "チキンフライドステーキのレシピ|Food.com",
        "description": "アメリカ南部の代表的な料理「チキンフライドステーキ」のレシピ。牛肉のステーキにパン粉をまぶし、揚げることで外側はカリッと、中は柔らかく仕上がります。クリーミーなグレービーソースと一緒に食べると絶品です。"
    },
    {
        "url": "https://www.delish.com/recipe/recipe-ideas/a23326239/best-mac-and-cheese-recipe/",
        "title": "極上のマックアンドチーズのレシピ|デリッシュ",
        "description": "必見!シェフ直伝の極上のマックアンドチーズのレシピ。まろやかでとろけるチーズのコクに、マスタードやトマトジュースでアクセントを加えたおいしさ。通常のマカロニに限らず、ペンネやフェットチーネ、エルボマカロニに合わせることもできます。"
    },
(以下略)

]

スクリプトです。(一部です。でもここがメインです。)

import { Configuration, OpenAIApi } from 'openai';

// -- chatGPT -------------- //
const onSubmitAI = async () => {
  startProcess();
  const { OPENAI_API_KEY: apiKey } = useRuntimeConfig();
  const configuration = new Configuration({ apiKey });
  const openai = new OpenAIApi(configuration);
  aiVal.status = `start`;
  if (val.description !== '') {
    aiVal.status = `${val.description}」を問い合わせ中・・・`;
    let tempReq =
      val.description +
      '、という質問に対し、情報が今現在掲載されているサイトをフォーマットを"[{url,title,description}]"で、JSON形式で出力せよ。descriptionは300文字以内で日本語以外は日本語に訳す。';

    let completion = null;
    try {
      completion = await openai.createChatCompletion({
        model: 'gpt-3.5-turbo',
        messages: [{ role: 'user', content: tempReq }],
      });
 
      console.log(completion.data.choices[0].message);
      let temp = completion.data.choices[0].message.content;
      temp.trim();
      temp = JSON.parse(temp);

      aiVal.result = temp.isArray ? temp : [temp];
      // console.log('結果', aiVal.result);
      aiVal.status = `end`;
      endProcess();
    } catch (error) {
      console.log(error);
      aiVal.status = `error`;
      endProcess({ isError: true, message: 'エラーが起きました' });
    }
  }
};

※実際の画面(答えが出るまで10-20秒はかかる)

ポイントはここかなと

val.description +
      '、という質問に対し、情報が今現在掲載されているサイトをフォーマットを"[{url,title,description}]"で、JSON形式で出力せよ。descriptionは300文字以内で日本語以外は日本語に訳す。';

しっかりこうやって出してねと言えば出してくれます。ただ、たまに自分のコメント間に入れてきたりするので、JSON.parseできなきゃエラーを返してやれば良いと思います。他にも、返ってきたjsonは空白だらけなのでtirm()を利かすとかも必要でした。

この辺の使い方は共有したいと思います。とりあえずリンク集は作れなかった!今後も色々試したいと思います。

唐突ですが、プロンプトデザイン集を作ってます。webデザインを参考にするならイケサイとかあるようにプロンプトデザイン例を集めたメディアというかブログです。毎日のようにプロンプトが試されてますので自分用に整理してます。よかったらどうぞ。(まだ少ないです)

https://ai-ecy.com/

Discussion