chatgptがすごいブームなのでサンプルアプリ作ってみました
AIの凄さが評判ですChatGPT: Optimizing Language Models for DialogueWe’ve trained a model called ChatGPT which interacts in a conversational way. The dialogue format makes it possible for ChatGPT to answer followup questions, admit its mistakes, ch…openai.comgoogleも黙っていないようですChatGPTに対抗、グーグルが会話型AI「Bard」グーグルも会話型AIと検索を統合へ。「ChatGPT」対抗の詳細は発表会で明らかに？マイクロソフトに続き、グーグルも検索エンジンと人工知能（AI）との統合を発表する見通しだ。発表会でグーグルは「ChatGPT」対抗の会話型AI「Bard」についても詳細を明かすかもしれない。wired.jpとりあえずWEBでchatgptのサンプルを作ってみました。英語で入力したら英語で答えてくれます英会話の勉強に使えたらいいですね！答えの長さを変えられます入力してエンターキーを押してくださいしばらくすると答えが返ってきます。ときどき変な答えが出ます質問の仕方を替えると正しい答えが返ってきますこどもたちに使わせてみます例試してみてください英語ですChatGPT APIサンプルclinic.mond.jp日本語はChatGPT APIサンプルclinic.mond.jpソースは<!DOCTYPE html><html lang="ja"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>ChatGPT APIサンプル</title> <script src="https://code.jquery.com/jquery-3.6.3.min.js" integrity="sha256-pvPw+upLPUjgMXY0G+8O0xUf+/Im1MZjXxxgOcBQBXU=" crossorigin="anonymous"></script> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous"> <script> var msg = new SpeechSynthesisUtterance(); var voices = window.speechSynthesis.getVoices(); var maxtokenval=50; msg.voice = voices[0]; // 7:Google 日本人 ja-JP ※他は英語のみ（次項参照） msg.volume = 1.0; // 音量 min 0 ~ max 1 msg.rate = 0.8; // 速度 min 0 ~ max 10 msg.pitch = 1.0; // 音程 min 0 ~ max 2 msg.lang = 'en-US'; // en-US or ja-JP $(function() { // unsupported. if (!'SpeechSynthesisUtterance' in window) { alert('Speech synthesis(音声合成) APIには未対応です.'); return; } $("input").on("keydown", function(e) { if ((e.which && e.which === 13) || (e.keyCode && e.keyCode === 13)) { getans(); } }); }); function getans() { let w = $("#q").val(); sendPrompt(w,maxtokenval); } async function sendPrompt(prompt = '',w) { let API_KEY = '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' if (!prompt) return const response = await fetch('https://api.openai.com/v1/completions', { method: 'POST', headers: { 'Content-Type': 'application/json', Authorization: `Bearer ${API_KEY}`, }, body: JSON.stringify({ 'model': 'text-davinci-003', // 'model': 'text-curie-001', // 動作テスト用（料金的に） 'prompt': prompt, "max_tokens": w, // 出力される文章量の最大値（トークン数） max:4096 "temperature": 1, // 単語のランダム性 min:0.1 max:2.0 "top_p": 1, // 単語のランダム性 min:-2.0 max:2.0 "frequency_penalty": 0.0, // 単語の再利用 min:-2.0 max:2.0 "presence_penalty": 0.6, // 単語の再利用 min:-2.0 max:2.0 "stop": [" Human:", " AI:"] // 途中で生成を停止する単語 }), }) const data = await response.json() console.log(data.choices[0].text.trim()) $("#ans").html(data.choices[0].text.trim()); speak(data.choices[0].text.trim()); } function speak(w) { msg.lang = 'en-US'; msg.text = w speechSynthesis.speak(msg); } function setMaxToken() { maxtokenval=Number($('[name=maxToken]').val()); } </script></head><body> 答えの長さ <div class=col-12> <select name=maxToken id=maxToken onchange="setMaxToken();"> <option value=1></option> <option value=10>10</option> <option value=50>50</option> <option value=150>150</option> </select> </div>質問(入力したらENTERキーを押します) <div class=col-12><input class="col-12 question" id=q name=q type=text></div>答 <div class=col-12 id=ans></div></body></html>
