OpenAI API Integration: AI Chat, Semantic Search, Content Generation

Introduction

Imagine an e-commerce site with thousands of products, managers spending 80% of their time on 'where is my order?' and 'how do I return?' questions, while customers leave due to slow responses. We faced this on a project where we implemented an AI chat on GPT-4o mini — response time dropped from 5 minutes to 5 seconds, and support load reduced by 70%. Integrating the OpenAI API solves such challenges: from chatbots to semantic catalog search. Our experience — over 5 years in development and over 30 AI projects on websites of various scales. Request a consultation — we'll analyze your case.

Problems We Solve

Support Overload

Every day — hundreds of identical questions. We configure GPT-4o mini with a system prompt based on your knowledge base. Result: the client receives an answer in seconds, a human only connects for complex cases. The cost of one request to GPT-4o mini is approximately $0.00015 (per 1000 tokens), allowing you to process thousands of requests for cents.

Complex Content Search

Regular full-text search does not understand synonyms and context. We implement semantic search via text-embedding-3-small and PostgreSQL with pgvector: search by meaning, not exact match. For example, the query 'how to connect WiFi' finds articles about router setup.

Manual Content Generation

Product descriptions, meta tags, news — writing them manually takes hours. DALL-E 3 creates images from text in seconds. We integrate generation directly into the CMS admin panel.

How We Do It

We use Laravel 11 on the backend and React 18 on the frontend. The OpenAI SDK for PHP handles requests to models. For streaming — Server-Sent Events.

Basic Chat Integration

use OpenAI\Client;

$openai = OpenAI::client(config('services.openai.api_key'));

$response = $openai->chat()->create([
    'model'    => 'gpt-4o-mini',
    'messages' => [
        ['role' => 'system', 'content' => 'You are the support assistant of company X. Answer briefly and to the point.'],
        ['role' => 'user',   'content' => $userMessage],
    ],
    'temperature' => 0.3,
    'max_tokens'  => 500,
]);

$answer = $response->choices[0]->message->content;

Streaming Responses (Server-Sent Events)

// PHP: server sends tokens as they are generated
Route::get('/api/chat/stream', function (Request $request) {
    $message = $request->query('message');
    return response()->stream(function () use ($message) {
        $openai = OpenAI::client(config('services.openai.api_key'));
        $stream = $openai->chat()->createStreamed([
            'model'    => 'gpt-4o-mini',
            'messages' => [['role' => 'user', 'content' => $message]],
        ]);
        foreach ($stream as $response) {
            $chunk = $response->choices[0]->delta->content ?? '';
            if ($chunk) {
                echo "data: " . json_encode(['content' => $chunk]) . "\n\n";
                ob_flush(); flush();
            }
        }
        echo "data: [DONE]\n\n";
    }, 200, [
        'Content-Type'  => 'text/event-stream',
        'Cache-Control' => 'no-cache',
    ]);
});

// TypeScript: client reads SSE stream and displays text gradually
async function streamChat(message: string, onChunk: (text: string) => void) {
  const resp = await fetch(`/api/chat/stream?message=${encodeURIComponent(message)}`);
  const reader = resp.body!.getReader();
  const decoder = new TextDecoder();
  while (true) {
    const { done, value } = await reader.read();
    if (done) break;
    const lines = decoder.decode(value).split('\n');
    for (const line of lines) {
      if (line.startsWith('data: ') && line !== 'data: [DONE]') {
        const data = JSON.parse(line.slice(6));
        onChunk(data.content);
      }
    }
  }
}

Embeddings for Semantic Search

// Indexing content
$response = $openai->embeddings()->create([
    'model' => 'text-embedding-3-small',
    'input' => $article->title . "\n" . $article->content,
]);
$embedding = $response->embeddings[0]->embedding; // vector 1536 dimensions

// Save to PostgreSQL with pgvector
DB::statement('UPDATE articles SET embedding = ? WHERE id = ?', [json_encode($embedding), $article->id]);

// Search by vector similarity
$queryEmbedding = getEmbedding($searchQuery); // your method for getting embeddings
$results = DB::select(
    'SELECT *, (embedding <=> ?) AS distance FROM articles ORDER BY distance LIMIT 5',
    [json_encode($queryEmbedding)]
);

Content Moderation

$moderation = $openai->moderations()->create([
    'input' => $userComment,
]);
if ($moderation->results[0]->flagged) {
    throw new ContentModerationException('Comment violates site rules');
}

Model Comparison: GPT-4o mini vs GPT-4o

GPT-4o mini is 20 times cheaper with nearly the same quality. For 90% of tasks, it is sufficient.

Why Streaming Improves User Experience?

The user expects a response within 2 seconds. Full text generation takes 5-15 seconds. Streaming sends tokens as they appear — the live typing effect reduces perceived latency. We implement SSE as in the example above, and the UI displays text gradually.

How to Choose a Model for a Chatbot?

If you need a fast and cheap chat — choose GPT-4o mini (temperature 0.3-0.5, up to 500 tokens). If the dialogue requires context analysis or translation — GPT-4o. For semantic search, use text-embedding-3-small — it generates a vector in 200 ms.

What's Included

• Documentation on integration and prompt structure
• Access to the code repository (GitLab/GitHub)
• Team training on working with AI features
• Technical support for 30 days after launch
• Monitoring and dashboards of key metrics

Integration Stages

1. Audit of the current site architecture, analysis of the knowledge base.
2. Design of BFF (Backend For Frontend) for secure API calls.
3. Implementation of a middleware layer with caching and rate limits.
4. Writing and testing prompts for your scenarios.
5. Integration with the chosen CMS (Laravel, WordPress, Drupal, etc.).
6. Monitoring and iterative improvement of response quality.

Key Monitoring Metrics

Common Mistakes and How to Avoid Them

• OpenAI recommends trimming dialog history to 10-20 messages to avoid exceeding token limits.
• N+1 queries: each API call costs money. Cache frequent answers (Redis, Cache).
• Context leakage: the system prompt is lost on restart. Add it to each request.
• Ignoring moderation: without it, the site risks toxic content. Enable the moderation endpoint.

Timeframes and Cost

Estimated timeframes:

• AI chat with streaming: 3–4 days
• Semantic search with pgvector: +2 days
• DALL-E 3 image generation: 1–2 days

The cost is calculated individually for your project. Support savings after implementation can reach 70% of monthly costs. Contact us for a preliminary estimate and a demonstration on your data. We will analyze the task and offer the optimal turnkey architecture. No fluff, only working code and support at all stages.

Ready to start? Request a consultation — we'll discuss the details of your project.

AI Integration: Chatbots, RAG, Semantic Search, Recommendations

In 8 out of 10 projects, an "AI chatbot" turns out to be an expensive wrapper over GPT-4o with a system prompt. Without access to real company data. The user asks "how much does the Premium plan cost?" — the bot hallucinates a price out of thin air. Asks "when will my order arrive?" — gets a polite "contact support." This is not integration — it's imitation. We have implemented RAG solutions in 30+ projects over 5 years: from e-commerce stores to medical portals. We guarantee: useful AI assistance begins where the model reads your documents, not generic answers.

How do we build RAG systems?

Retrieval-Augmented Generation — standard architecture: query → find relevant fragments in a vector DB → insert found context → model response. But the devil is in the implementation details. Let's break down key components that determine quality.

Chunking. Cutting a document into 500-token pieces without regard for structure is a guarantee of losing meaning. If the cut lands in the middle of a paragraph, context breaks. Solution — recursive RecursiveCharacterTextSplitter with 10–15% overlap for documentation. For contracts and instructions, we use a semantic splitter: extract headings, lists, code blocks — each section becomes an independent chunk. Difference in search quality: on a medical project, precision increased from 0.55 to 0.84 just by proper chunking.

Embedding model. For Russian-language texts, intfloat/multilingual-e5-large gives a noticeable accuracy boost over outdated text-embedding-ada-002. In our measurements, NDCG@10 on a test set of 10,000 query-document pairs is 12% higher. OpenAI text-embedding-3-large is good for English content, but for Russian we recommend BAAI/bge-m3 or the mentioned e5-large.

Vector DB. If you already have PostgreSQL — pgvector saves resources. Install extension CREATE EXTENSION vector, add column vector(1024), create HNSW index. On a project with 80,000 support articles, p95 search time was 12 ms. That's enough. For catalogs with millions of items — Qdrant or Weaviate: native hybrid search and sharding out of the box.

What does hybrid search give?

Vector-only search is blind to exact matches: SKUs like "ABC-123", proper names, abbreviations are lost. Full-text-only search doesn't catch synonyms and paraphrasing. Combining via RRF (Reciprocal Rank Fusion) gives the best of both worlds: BM25 + vector search, results merged. In practice, recall@20 increases from 0.65 to 0.92 — the difference is noticeable to the user.

Reranking — final filter: top-20 candidates from hybrid search are run through a cross-encoder cross-encoder/ms-marco-MiniLM-L-6-v2. It adds 50–100 ms to response time, but relevance improves by another 5–10%. Without reranking, the chatbot may show irrelevant documents.

How to implement semantic search on a site?

A search for "comfortable leather armchairs" should find products described as "soft chairs made of natural leather" — ordinary LIKE search cannot do this. Our architecture: when adding a product/post, automatically generate an embedding via multilingual-e5-large, store it in pgvector. On query, embed it with the same model, search nearest neighbors via cosine distance with HNSW index. For a catalog of 100,000 items, index builds in 3 minutes, memory ~400 MB (1536-dimensional vectors). Average search time: 20 ms.

What about recommendation systems?

Collaborative filtering ("users like you bought X") requires history — at least 2–3 months of data with 1000+ active users. For startups or small projects, we use content-based: embedding of current product → search nearest neighbors by cosine similarity. When enough statistics accumulate (usually 15–20 interactions per user), we switch to a hybrid LightFM model. It combines behavior and product features. In our e-commerce project with 50,000 SKUs, the hybrid model increased conversion in the recommendation block by 18% (A/B test lasted 2 weeks).

How does streaming work?

Users shouldn't wait for the entire text to be generated — it kills UX. Server-Sent Events (SSE) is the protocol for token streaming. OpenAI SDK supports stream: true, returning an AsyncIterator. On frontend — Vercel AI SDK (useChat) or custom EventSource. Typical mistake: using WebSocket for unidirectional streaming — SSE is simpler (less code, built-in reconnect). Stack: Node.js + SSE + React.

How to orchestrate agents?

A simple chatbot answers. An agent performs actions: creates a Jira ticket, checks order status in CRM, books a calendar slot. For orchestration, we use LangGraph: state graph where each node is a model or tool call. Vercel AI SDK useChat + tools for Next.js allows adding integration in 10 lines of code. Main challenge — reliability: the model sometimes calls the wrong tool or passes malformed parameters. Protection — Zod schemas for each tool and structured outputs to guarantee JSON.

What does the work include?

Additionally: we hand over vectorizer source code, monitoring dashboards (Langfuse), admin panel access for knowledge base updates. Post-production support — 1 month free.

What are the timelines?

Pricing is calculated individually after project discovery. We'll evaluate your project in 1 day. Contact us — we'll show how to turn AI from a toy into a profit-driving tool.