Whisper API 录音转文字应用——AI 生成示例提示词
代码预览
エディタを読み込み中…
P
提示词
Create a single HTML file with embedded CSS and JS that uses the browser's MediaRecorder API to record audio from the microphone, then sends the audio blob to OpenAI's Whisper API (configurable API key) for transcription. Show a real-time waveform visualization using Canvas. Include a start/stop recording button, a transcription result area, and a status indicator. Style with a modern dark theme.
このデモは、ブラウザのMediaRecorder APIとOpenAIのWhisper APIを使用したリアルタイム音声文字起こしアプリケーションです。ユーザーはマイクで音声を録音し、キャンバス上でライブ波形を確認しながら、文字起こし結果を受け取ることができます。
UIはダークテーマでクリーンなレイアウトを採用し、APIキー入力フィールド、録音開始/停止ボタン、波形キャンバス、文字起こし結果エリアを備えています。ステータス表示により、録音中や文字起こし中のフィードバックを提供します。
このデモを使用するには、WhisperモデルにアクセスできるOpenAI APIキーが必要です。音声はWebMブロブとして録音され、そのままWhisper APIに送信されて文字起こしが行われます。
提示词解读
此演示是一个利用浏览器MediaRecorder API和OpenAI Whisper API的实时语音转文字应用。用户可通过麦克风录制音频，在画布上实时查看波形，并接收转写结果。
界面采用深色主题与简洁布局，包含API密钥输入框、录音开始/停止按钮、波形画布以及转写结果区域。状态提示可在录音或转写过程中提供实时反馈。
使用此演示需具备可访问Whisper模型的OpenAI API密钥。音频将以WebM格式录制，并直接发送至Whisper API进行转写处理。
这个提示对您有帮助吗？
评论
评论将在审核后显示
この記事が役に立ったら投げ銭で応援
Apple Pay / Google Pay / カード (Visa/Mastercard/JCB/Amex) / Link / Alipay / WeChat Pay 対応 · Stripeで安全に決済
開発者が選ぶ最強ツール集
運営者が毎日使っているツール・ガジェット 6選