🈳
Sora でウォーターマークなしの動画を生成してダウンロード！Webアプリ Soraris
こんにちは！OpenAI の Sora API が公開されたので、せっかくなので動画生成からダウンロードまでできる Soraris というサービスを作りました。（記事も実装も、CodexとClaude Codeを使用しました）
制作活動で動画素材を使う機会があり、Sora で生成した動画を活用していたのですが、Sora の Web サイト（sora.chatgpt.com）やアプリには少々の不便さを感じてました。
API が公開されたことをきっかけに、「ウォーターマークなしで動画をダウンロードできるツールを作ろう！」と思い立ち、スキマ時間でサクッと作ったのが Soraris です。
Soraris でできること
Soraris は、OpenAI Sora API を使って動画生成から管理までを一元化できる Web アプリです。
✨ 主な機能
- 🎯 ウォーターマークなしの動画をダウンロード（API 経由のため）
- 🔐 自分の OpenAI API キーを設定（暗号化して安全に保存）
- ✍️ プロンプトを入力して Sora 2 / Sora 2 Pro で動画生成
- ⏱️ 生成状況をリアルタイムでポーリング
- 📚 生成した動画をライブラリで一覧表示
- ⬇️ ダウンロードもワンクリック
まだ荒削りな MVP で、バグもあると思いますが、これから色々な機能を追加していく予定です。ぜひ触ってみてください！
Soraris の主な機能
✅ 実装済み機能
認証周り
- Google OAuth 認証: Supabase Auth を使ったシンプルな認証フロー
- セッション管理: サーバーサイドでセッション検証
動画生成
- モデル選択: Sora 2 / Sora 2 Pro の切り替え
- 詳細設定: 解像度（720p/1080p）、動画の長さ（4秒/8秒/12秒）、参照画像アップロード
- 公開設定: プライベート / パブリック切り替え（まだ未実装）
セキュリティ
- API キー暗号化保存: AES-256-GCM で暗号化して Supabase に保存
- レート制限: GET: 30req/min, POST/DELETE: 10req/min
- Content Security Policy (CSP): XSS 攻撃を防ぐ
- セキュリティヘッダー: HSTS, X-Frame-Options, X-Content-Type-Options, XSS Protection
- ログ保護: API キーなどセンシティブデータはログに記録しない
動画管理
- ライブラリ表示: 生成した動画を時系列で一覧表示
- ステータス管理: 処理中 / 完了 / 失敗 のバッジ表示
- リアルタイムポーリング: 6秒間隔で自動更新
- モーダル表示: Next.js 14 Parallel Routes を活用
UI/UX
- ダークテーマ: グラスモーフィズムを取り入れたモダンなデザイン
- レスポンシブ: モバイル / タブレット / デスクトップ対応
- Tailwind CSS: 高速プロトタイピング
- shadcnで実装中、HeroUIも検討
最後まで読んでいただき、ありがとうございました！
Discussion