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()veyabodyParser) 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
Originbaşlığı gerektirir. - Oturum çerezleri
SameSite=StrictveHttpOnlyolarak 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:3000kökenini paylaşır.