TOML Editörünü web sitenize yerleştirin
Geliştiriciler için: TOML Editörünü kendi sayfanıza nasıl koyacağınız - bir iframe içinde, kendi penceresinde veya salt okunur bir görüntüleyici olarak - ve belgelerin, kayıtların ve yapay zekâ sonuçlarının editör ile sunucunuz arasında nasıl taşındığı. Bizden kayıt veya anahtar gerekmez.
Her https sayfası (ve localhost) editörü bir <iframe> ve ?embed=1 ile yerleştirebilir - kayıt yok, anahtar yok. Yerleştirildiğinde editör sayfa metnini gizler ve bir Kaydet düğmesi gösterir. Belgeyi içeri almanın ve dışarı vermenin dört yolu vardır.
1. Bir bağlantıdan dosya açın, sunucunuza kaydedin
src= bir dosya açar (sunucunuz CORS'a izin vermelidir), webhook= ise "Kaydet"in (Ctrl+S) belgeyi o adrese göndermesini sağlar. Her değişiklikten sonra kaydetmek için &auto ekleyin.
<iframe src="https://toml.giit.ch/tr/?embed=1&src=https://your-site.com/config/app.toml&webhook=https://your-site.com/save.php"
allow="clipboard-write" style="width:100%;height:800px;border:0"></iframe>
Webhook, JSON içeren bir POST alır: { editor: "toml", event: "save", id, name, content, updated }. Bağlantıda token bulunmaz; aksi hâlde sunucu günlüklerine ve tarayıcı geçmişine kaydedilirdi. Bu nedenle adreste belirtilen webhook, localhost veya intranetiniz gibi token gerektirmeyen bir kayıt adresi için uygundur. Herkese açık bir sunucu için webhook’u bir token ile tomleditor:load içinde (hook: { url, token }) aktarın ve aşağıdaki küçük PHP betiğinin yaptığı gibi token’ı doğrulayın:
<?php
header('Access-Control-Allow-Origin: https://toml.giit.ch');
header('Access-Control-Allow-Headers: Content-Type, Authorization');
header('Access-Control-Allow-Methods: POST, OPTIONS');
if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') exit;
if (($_SERVER['HTTP_AUTHORIZATION'] ?? '') !== 'Bearer SECRET') { http_response_code(403); exit; }
$d = json_decode(file_get_contents('php://input'), true);
$name = preg_replace('/[^\w\- ]/u', '_', $d['name']);
file_put_contents(__DIR__ . "/config/$name.toml", $d['content']);
echo '{"ok":true}';
2. Belgeyi sayfanız tutar (postMessage)
Editör tomleditor:ready der, sayfanız tomleditor:load ile yanıt verir, editör tomleditor:loaded, gerçek düzenlemelerde tomleditor:change ve kullanıcı kaydettiğinde tomleditor:save bildirir. Sayfanız tomleditor:get (geçerli durum) veya tomleditor:save (Kaydet'e basma) gönderebilir. Kaydetme böylece kendi oturum açma ve oturum sisteminiz üzerinden yapılır.
<iframe id="ed" src="https://toml.giit.ch/tr/?embed=1" allow="clipboard-write" style="width:100%;height:800px;border:0"></iframe>
<script>
const ed = document.getElementById('ed');
const ORIGIN = 'https://toml.giit.ch';
addEventListener('message', async e => {
if (e.source !== ed.contentWindow || e.origin !== ORIGIN) return;
const m = e.data;
if (m.type === 'tomleditor:ready') { // editör hazır: belgeyi ona verin
ed.contentWindow.postMessage({
type: 'tomleditor:load',
name: 'Settings',
content: await (await fetch('/config/app.toml')).text()
}, ORIGIN);
}
if (m.type === 'tomleditor:change') document.title = '● not saved'; // gerçek bir düzenleme
if (m.type === 'tomleditor:save') { // kullanıcı "Kaydet"e tıkladı
await fetch('/api/save', { method: 'POST', headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ name: m.name, content: m.content }) });
document.title = 'Saved';
}
});
// Kendi sayfanızda bir kaydet düğmesi: yanıt tomleditor:save olarak gelir
function saveNow() { ed.contentWindow.postMessage({ type: 'tomleditor:get' }, ORIGIN); }
</script>
Sayfanızın içinde Yapay Zekâ Asistanı: çerçeve içinde de çalışır. iframe üzerinde allow="clipboard-write" ile "İstemi kopyala" panoyu doğrudan kullanır (aksi halde editör eski kopyalama komutuna geri döner veya istemi elle kopyalamanız için gösterir). Yapay zekânın gönderdiği bir bağlantı başka bir web sitesinin içindeki editöre ulaşamaz. Bu yüzden editör, yapay zekâdan ve kullanıcıdan bunun yerine yapay zekânın yanıtının tamamını editöre yapıştırmasını ya da editörü kendi penceresinde açmasını ister.
3. Kendi penceresinde
window.open("https://toml.giit.ch/tr/?embed=window", "tomleditor-17") tam editörü kendi penceresinde açar ve aynı mesajları window.opener ile konuşur. Yapay zekâdan gelen bağlantılar ona orada ulaşır. tomleditor:load ayrıca context: { host, title, rules } taşıyabilir - yapay zekâ istemi bu durumda belgenin nereye ait olduğunu söyler ve kurallarınıza uyar - ve hook: { url, token }, yalnızca bu belge için olan ve asla saklanmayan bir webhook. Kaydedilmemiş değişikliklerle pencereyi kapatmak tomleditor:closing gönderir.
4. Kendi sunucunuz üzerinden yapay zekâ
Editöre kendi isteminizi, sitenizde bir adresi ve bu editör oturumu için bir anahtarı verin. Yapay zekâ iletişim kutusu bu durumda sitenize "Bağlı" olduğunu, yapay zekâya ne söylediğinizi ve geçerli belgeyi değiştir veya yeni bir belge oluştur seçimini gösterir; İstemi kopyala hepsini bir araya getirir. Yapay zekâ sonucunu anahtarla sunucunuza gönderir ve sayfanız onu editörde açar - yeni bir belge ayrı açılır ve kullanıcının tarayıcısında kalır. Editör oturumu başına bir anahtar: editör açık olduğu sürece geçerli kalır ve editör yalnızca anahtarı yokken tomleditor:key-request ile ister. Editör anahtarı asla kendisi göndermez ve asla saklamaz; adres kendi alan adınızda veya onun bir alt alan adında https olmalıdır.
const key = async () => (await fetch('/api/ai-key.php?doc=17')).json(); // editör oturumu başına bir anahtar
const k = await key();
ed.contentWindow.postMessage({ type: 'tomleditor:load', name: 'Settings', content, ai: {
label: 'My Site', prompt: 'Keep every key and every comment.',
endpoint: 'https://your-site.com/api/ai-result.php', key: k.key } }, ORIGIN);
// tomleditor:loaded içindeki id'yi hatırlayın ve başka id'li change/save/closing mesajlarını yok sayın
// yalnızca editörün anahtarı yokken:
if (m.type === 'tomleditor:key-request') { const k = await key(); ed.contentWindow.postMessage({ type: 'tomleditor:ai', key: k.key }, ORIGIN); }
// editör açıkken sunucunuza her dakika bildirin; editörü veya sayfayı kapatmak anahtarı geçersiz kılar
setInterval(() => fetch('/api/ai-key.php?alive=' + k.key.slice(0, 8)), 60000);
// sunucunuzda bir sonuç var (polling, SSE …): target "current" veya "new" olur
ed.contentWindow.postMessage({ type: 'tomleditor:load', name: 'Settings', content: draft, from: 'ai', target }, ORIGIN);
Anahtarları en az 128 rastgele bitle oluşturun, yalnızca özetlerini (hash) saklayın, her birini oturum açmış kullanıcıya, belgeye ve bu editör oturumuna bağlayın, oturum başına bir tane oluşturun, yalnızca sayfanız oturumu açık bildirdiği sürece geçerli tutun ve editör veya sayfa kapandığında geçersiz kılın.
Protokolün tamamı llms.txt dosyasındadır - bir yapay zekâya verin, sisteminiz için bağlantıyı o kursun. Diğer giit editörleri de kendi önekleriyle aynı şekilde çalışır - editors.giit.ch.
Belgeyi salt okunur göstermek (görüntüleyici)
?viewer=1 yalnızca bitmiş belgeyi gösterir: kod yok, araç yok, hiçbir şey değiştirilemez ve tarayıcıda hiçbir şey saklanmaz. Belge bir bağlantıdan (#b64=, ?src=), sayfanızdan tomleditor:load ile veya normal bir form olarak POST ile post.php adresine gelir: metin olarak content ya da base64 olarak b64 alanı, isteğe bağlı name, en fazla 20 MB metin.
<form method="post" action="https://toml.giit.ch/post.php?viewer=1" target="_blank">
<input type="hidden" name="lang" value="tr">
<input type="hidden" name="name" value="Report">
<input type="hidden" name="b64" value="…">
<button>Open</button>
</form>
viewer=1 olmadan belge normal düzenleyicide açılır. Her iki durumda da yalnızca bellekte kalır: sunucuda saklanmaz ve "Belgelerim" bölümüne girmez. Doğrudan açıldığında görüntüleyici içeriğin üçüncü taraftan geldiğini belirtir.