Vite + Node Sunucu Entegrasyonu

Vite hızlı bir ön yüz derleme aracıdır; sunucu API çalışma zamanı sağlamaz. Vite ile derlenen React uygulamanızda CopyPatch kullanmak için, backend çalışma zamanını uygulamanızı ve API'nizi sunan Node.js sunucusuna bağlayın.

Express Entegrasyonu

@copypatch/node paketinden expressMiddleware(backend) fonksiyonunu kullanarak ara yazılımı bağlayın:

server.ts (Express)
import express from 'express';
import { createCopyPatchBackend } from '@copypatch/backend';
import { expressMiddleware } from '@copypatch/node';
import { createSQLitePersistence } from '@copypatch/storage-sqlite';

const app = express();
const persistence = createSQLitePersistence('./data/copypatch.sqlite');
await persistence.migrate();

const backend = createCopyPatchBackend({
  persistence,
  passphraseHash: process.env.COPYPATCH_PASSPHRASE_HASH!,
});

// KRİTİK: CopyPatch ara yazılımını express.json() / body-parser ve SPA fallback'inden ÖNCE mount edin
app.use('/__copypatch/api/v2', expressMiddleware(backend));

// Ana uygulamanın gövde ayrıştırıcıları ve statik dosyaları
app.use(express.json());
app.use(express.static('dist'));

// SPA Catch-all Yönlendirmesi
app.get('*', (req, res) => {
  res.sendFile('dist/index.html', { root: '.' });
});

app.listen(3000, () => {
  console.log('Uygulama http://localhost:3000 adresinde çalışıyor');
});
Kritik Ara Yazılım Sırası: expressMiddleware(backend) çağrısını her zaman gövde ayrıştırıcı ara yazılımlardan (express.json() veya bodyParser) ve SPA genel yönlendiricisinden (app.get('*')) önce yapın. CopyPatch ham HTTP akışını doğrudan okur.

Hono Entegrasyonu

Hono, standart Web Request/Response nesneleriyle doğrudan çalışır:

server.ts (Hono)
import { Hono } from 'hono';
import { serve } from '@hono/node-server';
import { createHonoHandler } from '@copypatch/node';
import { backend } from './lib/copypatch';

const app = new Hono();

// Standart v2 yoluna bağlama
app.all('/__copypatch/api/v2/*', createHonoHandler(backend));

serve(app, (info) => {
  console.log(`Sunucu http://localhost:${info.port} üzerinde aktif`);
});

Fastify Entegrasyonu

Fastify entegrasyonu request.raw ve reply.hijack() mekanizmalarını kullanır:

server.ts (Fastify)
import Fastify from 'fastify';
import { fastifyCopyPatchHandler } from '@copypatch/node';
import { backend } from './lib/copypatch';

const fastify = Fastify();

// Fastify request.raw ve reply.hijack() kullanır; gövde ayrıştırıcılarından önce tanımlayın
fastify.all('/__copypatch/api/v2/*', fastifyCopyPatchHandler(backend));

await fastify.listen({ port: 3000 });

Neden Vite Dev Proxy Kullanılmamalı?

vite.config.ts dosyası içinde CopyPatch için harici bir reverse proxy tanımlamayın. CopyPatch v2 sıkı same-origin güvenlik kontrolleri uygular:

  • Değişiklik yapan (mutating) tüm istekler tarayıcıdan host etki alanıyla birebir eşleşen Origin başlığı gerektirir.
  • Oturum çerezleri SameSite=Strict ve HttpOnly olarak korunur.
  • Yerel geliştirme ortamında Node sunucunuzu Vite ile middleware modunda çalıştırın (bkz. examples/vite-node); böylece React arayüzü ve API tamamen aynı http://localhost:3000 kökenini paylaşır.