TutuCut

Editor video integrabile

Una riga di codice porta un editor video con timeline sul tuo sito.

Il componente integrabile di TutuCut: con una riga di codice porti su qualsiasi sito un editor video con timeline (tagli, sottotitoli, effetti, transizioni). Tema, strumenti ed esportazione configurabili, liste di domini consentiti o bloccati, e gli aggiornamenti dell’editor si applicano da soli.

Un tag script mette l’editor con timeline di TutuCut nella tua pagina. I visitatori tagliano e aggiungono sottotitoli ed effetti lì stesso; premendo Fatto, il fotogramma corrente arriva alla tua pagina come immagine tramite il callback onSave.

Copia e incolla · mettilo prima del </body> del tuo sito
<script src="https://tutucut.com/embed.js"
        data-key="pk_live_YOUR_KEY"
        data-mount="#cc-editor" defer></script>

Sostituisci pk_live_YOUR_KEY con una chiave generata da te nella console (qualsiasi utente registrato, senza revisione, effetto immediato); il contenitore #cc-editor deve avere larghezza e altezza. Registra l'URL di incorporamento durante l'integrazione (whitelist; usa localhost per lo sviluppo locale) — appare solo sui siti che registri.

Provalo dal vivo

Fai clic sul pulsante qui sotto per provare l'editor video incorporato proprio su questa pagina.

API JS (per callback / personalizzazione)

<script src="https://tutucut.com/embed.js"></script>
<script>
  const cc = TutuCut.mount('#cc-editor', {
    key: 'pk_live_YOUR_KEY',
    theme: 'auto',            // auto | light | dark
    onSave: (file) => {
      // file.dataUrl = current frame image (base64)
      upload(file.dataUrl);
    }
  });
  cc.open('https://your.site/clip.mp4'); // import a media clip
</script>

Riferimento completo dei parametri

ParametroTipoDescrizione
keystringLa tua chiave pubblica pk_ (generata nella console). Obbligatorio.
theme'auto'|'light'|'dark'Tema; auto segue la modalità chiara-scura di host/sistema.
hideHeaderbooleanNasconde la barra superiore (quando crei la tua UI ed esporti con export()).
hideOpenbooleanNasconde il pulsante "Apri media".
hideExportbooleanNasconde il pulsante "Esporta e scarica".
saveTextstringTesto del pulsante "Fatto" (predefinito "Fatto e rinvia", ≤16 caratteri).

Metodi

  • cc.open(url, name?)Importa un clip multimediale nella timeline (url video/audio/immagine o dataURL).
  • cc.export(format?)Esporta il fotogramma corrente → Promise<{dataUrl,mime,size}>.
  • cc.setTheme('dark')Cambia il tema a runtime.
  • cc.destroy()Smonta il widget (rimuove l'iframe).

Callback degli eventi

  • onReady()L'editor è pronto.
  • onSave(file)L'utente tocca "Fatto" → file.dataUrl è l'immagine del fotogramma corrente.
  • onError(e)e.message è leggibile (non abilitato / nessun permesso / caricamento fallito).
  • onClose()L'overlay a schermo intero è stato chiuso.

Sicurezza · aggiornamenti automatici

  • · Self-service, approvazione automatica: qualsiasi utente registrato ottiene una chiave registrando un nome di sito + URL di incorporamento nella console, con effetto immediato.
  • · La chiave è pubblica; l'abuso è impedito da una lista di autorizzazione/blocco di URL registrati (il blocco ha priorità). I domini non registrati vengono rifiutati con un invito a registrarsi; puoi attivare o disattivare in qualsiasi momento.
  • · Statistiche per origine reale: ogni caricamento è conteggiato per Origin (anche quelli bloccati); la console mostra il dettaglio per origine e i domini non registrati si aggiungono alla whitelist con un clic.
  • · L'editor gira sul dominio proprio di TutuCut (isolato); la tua pagina non può accedere ad alcuna credenziale di TutuCut e le opere private di un visitatore su TutuCut non compaiono mai nel widget incorporato.
  • · Il widget è self-hosted e aggiornato automaticamente da TutuCut — gli aggiornamenti non richiedono modifiche al codice da parte tua e zero manutenzione.

Domande frequenti

Influisce sull’isolamento cross-origin della mia pagina?
No. L’editor gira in un iframe sul dominio di TutuCut e non richiede SharedArrayBuffer, quindi la tua pagina non ha bisogno di intestazioni COOP / COEP.
I video dei visitatori vengono caricati sui vostri server?
No. Il montaggio avviene nel browser del visitatore, e la modalità integrata non vi lascia nemmeno bozze. La tua pagina riceve solo l’immagine consegnata quando il visitatore preme Fatto.
Come ottengo una chiave?
Accedi, registra nella console il nome del sito e l’URL della pagina e ottieni subito una chiave pubblica attiva. La chiave è pubblica; gli abusi sono bloccati dalle liste di URL consentiti e vietati che registri (il divieto prevale).

Strumenti correlati