Integrate Emby API with your Next.js application
npm install openai
pnpm add openai
yarn add openai
.env.local
EMBY_API_KEY=your-api-key-here EMBY_BASE_URL=https://dev.emby.ai/v1
.gitignore
// lib/emby.ts import OpenAI from 'openai'; export const emby = new OpenAI({ apiKey: process.env.EMBY_API_KEY, baseURL: process.env.EMBY_BASE_URL, });
// app/api/chat/route.ts import { emby } from '@/lib/emby'; import { NextRequest, NextResponse } from 'next/server'; export async function POST(request: NextRequest) { const { messages } = await request.json(); const completion = await emby.chat.completions.create({ model: 'gpt-4o', messages, }); return NextResponse.json(completion.choices[0].message); }
// app/api/chat/route.ts import { emby } from '@/lib/emby'; import { NextRequest } from 'next/server'; export async function POST(request: NextRequest) { const { messages } = await request.json(); const stream = await emby.chat.completions.create({ model: 'gpt-4o', messages, stream: true, }); const encoder = new TextEncoder(); const readable = new ReadableStream({ async start(controller) { for await (const chunk of stream) { const text = chunk.choices[0]?.delta?.content || ''; controller.enqueue(encoder.encode(text)); } controller.close(); }, }); return new Response(readable, { headers: { 'Content-Type': 'text/plain; charset=utf-8' }, }); }
// components/Chat.tsx 'use client'; import { useState } from 'react'; export function Chat() { const [input, setInput] = useState(''); const [response, setResponse] = useState(''); const [loading, setLoading] = useState(false); const handleSubmit = async (e: React.FormEvent) => { e.preventDefault(); setLoading(true); setResponse(''); const res = await fetch('/api/chat', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [{ role: 'user', content: input }], }), }); const reader = res.body?.getReader(); const decoder = new TextDecoder(); while (reader) { const { done, value } = await reader.read(); if (done) break; setResponse((prev) => prev + decoder.decode(value)); } setLoading(false); }; return ( <form onSubmit={handleSubmit}> <input value={input} onChange={(e) => setInput(e.target.value)} placeholder="Ask something..." /> <button type="submit" disabled={loading}> {loading ? 'Thinking...' : 'Send'} </button> {response && <p>{response}</p>} </form> ); }
// Popular choices const model = 'gpt-4o'; // Fast and capable const model = 'gpt-5'; // Most powerful const model = 'claude-sonnet-4-5'; // Anthropic's latest
Was this page helpful?