前回の記事で日本語の文字を正しく分割する方法に Intl.Segmenter を使いましたが、Intl.Segmenter は文章を単語で分割することもできます。以前は形態素解析のオンラインサービスに...
Continue reading...webfrontend.ninja
【JavaScript】文字数のカウントになぜ String.length を使ってはいけないのか
JavaScript で文字列の文字数をカウントするには String.length を使うことが多いのではないでしょうか。しかし、扱う文字によっては適切な文字数を得られない場合があります。今回は、そ...
Continue reading...【JavaScript】スペースの URL エンコードの結果は %20 と + のどちらが正解なのか
クエリパラメータのエンコードとデコードには encodeURIComponent() 関数と decodeURIComponent() 関数を使うことが多いのではないしょうか。一方で URL インタフ...
Continue reading...【JavaScript】ブラウザーで OpenAI API のチャット (Chat Completions) のストリームを扱う方法
過去 2 回の記事では OpenAI API の音声認識 (Speech to Text) と音声合成 (Text to Speech) を扱いましたが、今回は ChatGPT でもおなじみのチャット...
Continue reading...【JavaScript】ブラウザーで OpenAI API の音声認識 (Speech to Text) でマイク音声を録音してアップロードする方法
前回は「ブラウザーで OpenAI の音声合成 (Text to speech) のダウンロード再生とストリーム再生する方法」を解説しましたが、今回はその逆で、音声ファイルをアップロード、または、マイ...
Continue reading...【JavaScript】ブラウザーで OpenAI の音声合成 (Text to speech) のダウンロード再生とストリーム再生する方法
いま話題の OpenAI API ですが、数多くラインナップされた API の中に音声合成 (Text to speech) の API が用意されています。今回は、ブラウザーだけを使って JavaS...
Continue reading...【JavaScript】Web Speech API – SpeechSynthesis (音声合成、Text-to-Speech) の使い方
AI の進化により音声合成の性能も向上し、さまざまなシーンで使われるようになってきました。多くは有料ですが、音声合成のクラウドサービスも多岐にわたります。しかし、近年のすべてのメジャーブラウザーで J...
Continue reading...【JavaScript】入力フォームで IME 確定時の Enter 誤判定を何とかする
近年のウェブアプリケーションでは、テキストボックスに文字を入力して Enter キーを押すことでアクションを起こすようなシーンが増えてきました。フォーム送信ではないため、JavaScript で制御す...
Continue reading...【JavaScript】データを GZIP/ZLIB/DEFLATE で圧縮そして展開する
ウェブブラウザの JavaScript でデータの圧縮と展開を行う場合、JavaScript ライブラリの「pako」が選択肢に上がることが多いでしょう。しかし、現在はどのブラウザでも Compres...
Continue reading...【JavaScript】画面遷移時にビーコンをサーバーに送信する Beacon API
[2023-12-02 更新] ウェブページやウェブアプリケーションからサーバーに対して何かしらのイベント情報を送信したいと考えたことはないでしょうか。それ自体は簡単時に実現可能なのですが、ページがア...
Continue reading...