Femoon/tts-azure-web

TTS Azure Web 是一个 Azure 文本转语音（TTS）网页应用，可以在本地或者云端使用你的 Azure Key 一键部署。TTS Azure Web is an Azure Text-to-Speech (TTS) web application. It allows you to run it locally or deploy it with a single click using your Azure Key.

TTS Azure Web – 速報

何であるか – Microsoft Azure のテキスト音声変換サービスを呼び出すことができる、軽量で自己ホスティング可能なWeb UIです。テキストを入力または貼り付け、グラフィカルインターフェースまたは直接SSMLマークアップで音声パラメータ（言語、スタイル、速度、音量など）を調整し、生成されたオーディオファイルをダウンロードできます。

なぜ重要か – Azure のニューラルTTSは高品質な商用音声合成エンジンです。このプロジェクトは、認証、API呼び出し、UI構築に必要なボイラープレートコードを排除し、開発者や趣味のユーザーがローカル環境で、またはワンクリックVercelデプロイでAzure TTSを実験できるようにします。

コア機能（READMEに記載）

音声カスタマイズ – 音声、言語、スタイル、キャラクターを選択。
オーディオコントロール – 速度、イントネーション、音量を調整。
デュアルモードエディタ –
- 通常モード：UIスライダーとドロップダウン。
- SSMLモード：細かい制御のための音声合成マークアップ言語（SSML）の直接編集。
SSMLのインポート/エクスポート – 設定を保存して後で再読み込み可能。
オーディオエクスポート – 生成された音声をオーディオファイルとしてダウンロード。
ステートの永続化 – Zustandと永続化ミドルウェアを使用して localStorage に設定を保存。
国際化 – 英語と簡体中国語のUI、自動ロケール検出。
レスポンシブデザイン – デスクトップとモバイルで動作。

技術スタック（READMEより）

レイヤー	技術
フロントエンドフレームワーク	Next.js 15（App Router）
UIライブラリ	HeroUI（NextUI v2） + Tailwind CSS v4 + Framer Motion
言語	TypeScript（React 19）
ステート管理	Zustand と永続化ミドルウェア
国際化	Next.js組み込みのi18n
音声バックエンド	Microsoft Azure Cognitive Services Speech SDK
パッケージング / デプロイ	Docker、Vercel、または単純なNode/Yarn

セットアップ手順（READMEの要約）

Azure資格情報の取得 – AzureでSpeech Serviceを作成し、SPEECH_KEY と SPEECH_REGION をメモ。

リポジトリのルートに .env.local を作成：

SPEECH_KEY=your_azure_key
SPEECH_REGION=your_azure_region
# オプション
NEXT_PUBLIC_MAX_INPUT_LENGTH=4000
NEXT_TELEMETRY_DISABLED=1

依存関係のインストール – プロジェクトはYarn Classicを使用：
```
npm i -g yarn   # 未インストールの場合
yarn
```
ローカルで実行 – 開発サーバー（localhostのみ）：
```
yarn dev
# またはLANに公開
yarn lan-dev
```
http://localhost:3000 を開く。
ビルド＆実行 – 本番環境向けのローカル実行用：
```
yarn build
yarn start
```

デプロイオプション

Vercel（ワンクリック） – READMEの「Deploy with Vercel」ボタンをクリックし、SPEECH_KEY と SPEECH_REGION を環境変数として入力。

Docker – コンテナをビルドして実行：

docker build -t tts-azure-web .
docker run -p 3000:3000 -e SPEECH_KEY=... -e SPEECH_REGION=... tts-azure-web

ローカル本番環境 – 環境変数ファイルを設定した後、Yarnのビルド/スタートコマンドを使用。

一般的な利用シーン

音声対応UIコンポーネントの迅速プロトタイピング。
コンテンツ作成 – 動画、ポッドキャスト、eラーニング用のナレーションやボイスオーバーを生成。
SSMLのテスト – コードを書かずにAzureのSSML機能を実験。
教育用デモ – クラスやワークショップでクラウドベースTTSの仕組みを紹介。

プロジェクトの健全性とメンテナンス

Linting & CI – ESLint（ゼロ警告ポリシー）、Prettier、Huskyプリコミットフック、Commitlint、Dependabotによるセキュリティパッチ。
Nodeバージョン – Node 22+必須；Yarn 1.22.22。
ライセンス – MIT。個人的・商用利用ともに許可。

さらに詳しく知りたい場合

ライブデモ – https://tts.femoon.top
ソースコード – https://github.com/Femoon/tts-azure-web
イシュー追跡 – リポジトリからリンクされたGitHub Issuesページ。

TL;DR: TTS Azure Web は、AzureのニューラルTTS APIをクリーンなUIでラップした、すぐに実行可能なNext.jsアプリです。シンプルなスライダーと完全なSSML編集をサポートし、Vercel、Docker、またはローカルNodeで簡単にデプロイ可能です。