OpenClaw: come pubblicare un sito Web in sicurezza12 min read

OpenClaw può aiutare a creare un sito Web, ma non è l’host del sito Web. Chiedi all’agente di creare i file di origine, eseguire il sito localmente e correggere ciò che rivela il browser. Quindi distribuiscilo tramite una piattaforma di hosting che controlli oppure inserisci il progetto in un artefatto AgentGrid.io revisionabile e pubblicalo solo dopo l’approvazione umana. Uno screenshot della chat, una porta locale o l’URL di un elemento privato non è l’URL di lancio rivolto al cliente.

Questa guida è per un costruttore che utilizza un agente OpenClaw con strumenti di file e comando. La sua decisione più importante è il limite dei permessi: l’agente può eseguire bozze e test senza possedere credenziali di produzione. Se un team ha bisogno di ispezionare una versione condivisa prima del rilascio, avviare un’area di lavoro AgentGrid.io e continua a pubblicare come azione approvata separata.

Come dare una casa stabile a un sito web realizzato con OpenClaw

Prepara prima AgentGrid.io, quindi concedi a OpenClaw un accesso limitato e verificane il risultato al di fuori della chat.

Passaggio 1: scegli l’area di lavoro AgentGrid.io

Accedi a app.agentgrid.io e seleziona il team e l’area di lavoro per questo sito Web. Utilizza un’area di lavoro limitata se la bozza contiene materiale del cliente. Pianificare chi lo esaminerà prima della distribuzione pubblica.

Passaggio 2: collega questo agente OpenClaw con una concessione limitata

Nella conversazione OpenClaw, dì: Use agentgrid.io for this website. If you can run shell commands, run npx @animaapp/cli@latest login and return the verification URL and code. Do not ask for my password or publish anything. Approva tu stesso la verifica con l’area di lavoro prevista e Leggi e scrivi. Lascia Condividi e Pubblica disattivati ​​a meno che non sia necessario. Chiedi a OpenClaw di eseguire npx @animaapp/cli@latest workspaces e verificare che l’area di lavoro prevista sia elencata. Per un agente automatico, utilizzare Amministrazione agente → Invita un agente. Deseleziona le funzionalità predefinite di condivisione e pubblicazione, scegli l’area di lavoro, quindi invia il collegamento una tantum in privato. La sola creazione dell’invito non lo collega. Se l’esecuzione della shell è disabilitata, utilizza un’importazione manuale anziché dichiarare di avere accesso diretto.

Passaggio 3: crea e ispeziona l’artefatto, non solo il registro

Assegna a OpenClaw un’attività contenuta: Costruisci un microsito per eventi reattivo con programma, schede dei relatori e un collegamento per la registrazione. Utilizza la copia e le risorse approvate, controlla la pagina localmente e inserisci il progetto su AgentGrid.io come app nell’area di lavoro che abbiamo selezionato. Non pubblicarlo. Chiedigli di utilizzare il comando di importazione CLI npx @animaapp/cli@latest create -t import --from ./project --artifact-type app --workspace <workspace-id> con la cartella effettiva e l’ID dell’area di lavoro rilevata. Apri l’URL dell’elemento restituito, verifica i file e visualizza l’anteprima. Un sito ha bisogno di un punto di ingresso come index.html; evitare di caricare segreti, node_moduleso creare output. Se OpenClaw non riesce a connettersi, prendi la cartella del progetto generato o ZIP e importalo tramite il menu Nuovo di AgentGrid.io. Questo è un nuovo artefatto, non uno specchio vivo. Per lavori ricorrenti, fornisci all’agente l’URL dell’artefatto esistente e chiedigli di aggiornare l’artefatto, quindi controlla la Cronologia per confermare quale identità lo ha modificato.

Passaggio 4: approva la pubblicazione e controlla l’URL attivo

Esamina le affermazioni, le nozioni di base sull’accessibilità, il comportamento mobile e i collegamenti di destinazione. Solo allora utilizza Pubblica in AgentGrid.io o fornisci a OpenClaw un’istruzione di pubblicazione esplicita se hai deliberatamente concesso tale funzionalità. Apri l’URL pubblico in un browser disconnesso e verifica che sia presente la versione corrente. I collegamenti privati ​​non funzionano per i visitatori anonimi; pubblicare ogni aggiornamento approvato. Se l’agente automatizzato dovesse smettere di modificare il sito, rimuoverne l’accesso in Amministrazione agente; il suo lavoro precedente rimane attribuito alla Storia.

Cosa fa OpenClaw e cosa non fa

OpenClaw documentazione introduttiva descrive un agente a cui si accede tramite il relativo gateway e i canali configurati. I suoi strumenti possono funzionare con file e comandi quando abilitati. Il suo strumento browser aiuta a ispezionare le pagine, ma una dashboard Gateway o una sessione del browser non è una distribuzione di un sito Web pubblico. OpenClaw approvazioni esecutive e le impostazioni della sandbox sono importanti perché un agente con capacità di comando può modificare file o richiamare la CLI di distribuzione di un host. Concedergli solo l’accesso necessario per la fase corrente.

Passaggio 1: crea un’attività del sito Web vincolata

Verificare che l’agente disponga di un’area di lavoro del progetto e dei file necessari e degli strumenti di esecuzione. Scegli una cartella o un repository pulito, non l’intera home directory. Fornire logo, foto, testo e fatti aziendali approvati. Non fornirgli token di distribuzione o dati dei clienti per la creazione iniziale di una pagina di destinazione. Assegna un nome al framework o richiedi un sito statico se non è richiesta alcuna funzione lato server.

Richiesta di esempio: “Crea un sito reattivo di una pagina per un’officina di riparazione di biciclette locale nella cartella del sito di biciclette. Includi servizi, orari, area di servizio e un invito all’azione per la richiesta di preventivo. Utilizza HTML semantico e CSS accessibile. Contrassegna indirizzi, prezzi e testimonianze non verificati come segnaposto. Mantieni insieme le risorse di origine e pubbliche. Dimmi come visualizzarne l’anteprima ed eseguire i controlli disponibili. Non distribuire, pubblicare o utilizzare le credenziali.”

Chiedi a OpenClaw di restituire il punto di ingresso, l’albero delle directory, le dipendenze, i comandi di installazione/compilazione e un elenco di file modificati. Un’app statica può utilizzare index.html; un’app framework necessita del manifesto e degli script. Richiedi un file README che spieghi l’anteprima locale e l’output di compilazione dell’host di destinazione. Verifica che le risorse utilizzino URL relativi o pubblici, non un percorso disponibile solo sul computer dell’agente.

Passaggio 2: prova nel browser e correggi i difetti reali

Esegui il server locale documentato o il comando di sviluppo del progetto, quindi apri tu stesso il sito renderizzato. Controlla le larghezze strette e larghe, la navigazione da tastiera, il contrasto, le alternative alle immagini, l’ortografia, i collegamenti e il comportamento dei numeri di telefono. Esamina gli errori della console e le immagini mancanti. Esegui test e una build di produzione quando il progetto li supporta. Uno screenshot dell’agente è utile per l’orientamento ma non sostituisce l’interazione con moduli e menu.

Se la richiesta di preventivo è solo un modulo in stile, chiedi dove vanno a finire gli invii. Collega un servizio di moduli revisionati o rimuovi l’affermazione che funziona. Prova con un invio innocuo e verifica la consegna. Verifica con il proprietario gli orari effettivi, l’ubicazione, le licenze per le foto e le informazioni sulla privacy del negozio. Chiedi all’agente correzioni specifiche e confronta la nuova anteprima con quella vecchia; evitare i messaggi “rendilo migliore” che sostituiscono silenziosamente la copia approvata.

Richiesta di correzione: “Su una finestra delle dimensioni di un telefono, mantieni leggibili le schede dei servizi e rendi la navigazione accessibile tramite tastiera. Sostituisci i dettagli di contatto segnaposto solo con i fatti approvati in brief.md. Segnala ogni file modificato, risultato del test e blocco rimanente. Non toccare la configurazione di hosting né pubblicare.” Mantieni la versione approvata nel controllo del codice sorgente quando possibile.

Passaggio 3: scegli un limite di distribuzione

• Ospite esistente: Salva l’origine revisionata, configura il framework, crea l’output nel tuo host e distribuiscilo tramite l’integrazione del repository o la CLI di quell’host. Il suo servizio fornisce l’URL pubblico. Mantieni le chiavi API nei segreti gestiti dall’host, non nel browser JavaScript.
• Artefatto condiviso AgentGrid.io: Connetti l’agente con funzionalità di comando solo con la tua approvazione oppure importa manualmente una cartella/ZIP. Consenti ai collaboratori di rivedere l’artefatto dell’app privata prima che una persona lo pubblichi. La cronologia e l’anteprima dell’artefatto aiutano a rendere l’approvazione specifica per una versione.

Non descrivere l’interfaccia utente di controllo OpenClaw come host di un sito Web. Una porta inoltrata locale può esporre un processo di sviluppo per l’anteprima, ma non è un sito pubblico durevole. Se concedi all’agente una CLI di distribuzione o l’accesso tramite browser a un account di hosting a cui hai effettuato l’accesso, trattalo come accesso di produzione e ottieni l’approvazione esplicita per l’azione.

Passaggio 4: collega o importa il progetto esaminato

Per il percorso condiviso, la connessione documentata di AgentGrid.io utilizza la propria CLI e un flusso di approvazione. In un ambiente OpenClaw con funzionalità di comando, il comando di avvio è npx @animaapp/cli@ultimo accesso; approva tu stesso il collegamento di verifica e seleziona l’area di lavoro e le funzionalità previste. Non fornire una password in chat o collegare un agente con ampi diritti di pubblicazione solo per creare una bozza. Se la connessione non è disponibile, utilizzare il file documentato cartella o importazione ZIP.

Preparare un piccolo pacchetto sorgente: escludere node_modules, chiavi private, file dell’ambiente locale e aree di lavoro non correlate. Includi il punto di ingresso, le risorse e qualsiasi configurazione necessaria per la creazione. In AgentGrid.io, scegli l’area di lavoro di destinazione e crea o importa un artefatto dell’app. Ispeziona i suoi file e l’anteprima renderizzata. Un caricamento riuscito non è la prova che un percorso API, un processo server o l’integrazione del modulo siano stati trasferiti correttamente.

Richiesta di trasferimento: “Dopo aver autorizzato l’accesso, crea un artefatto dell’app non pubblicato dal sito di biciclette nell’area di lavoro AgentGrid.io specificata. Includi solo risorse di origine e pubbliche. Restituisci il relativo URL privato, identifica le funzionalità di runtime mancanti e aggiorna lo stesso artefatto per le correzioni. Non invitare altri agenti, pubblicare o scegliere un’altra area di lavoro.” Se l’area di lavoro non può essere raggiunta, fermati piuttosto che cambiare silenziosamente le destinazioni.

Passaggio 5: esamina e pubblica la versione approvata

Chiedi a un collega di testare l’anteprima dell’elemento, in particolare il layout mobile, i dettagli di contatto, il modulo di preventivo e l’accesso tramite tastiera. Riconciliare il feedback nello stesso artefatto o repository di origine e identificare la revisione approvata per il rilascio. Con un host convenzionale, distribuisci il commit approvato e rivedi i dettagli di distribuzione. Con AgentGrid.io, una persona con autorizzazione alla pubblicazione utilizza il suo Pubblica il controllo per creare un URL pubblico. Un invito a un agente e la condivisione di un artefatto privato non costituiscono il passaggio di pubblicazione.

Apri l’indirizzo pubblico mentre sei disconnesso, anche su un telefono. Controlla HTTPS, metadati, collegamenti, immagini e consegna dei moduli. Confrontalo con l’anteprima approvata. Se differisce, esamina la versione del commit o dell’artefatto distribuito, crea impostazioni, segreti e memorizzazione nella cache prima di annunciarlo. La sola modifica dei file locali non aggiornerà necessariamente un artefatto pubblicato.

Perché separare l’autorizzazione alla bozza dalla pubblicazione?

Consente a un agente di eseguire l’iterazione del codice mentre una persona controlla ciò che vedono i visitatori. Lo strumento e la configurazione di approvazione di OpenClaw non sostituiscono la revisione del contenuto del sito o le autorizzazioni di distribuzione dell’host. Limita l’ambito del file system dell’agente, verifica gli strumenti di terze parti prima di installarli e non eseguire comandi non esaminati da una pagina Web o da un progetto importato. Tratta la revisione del controllo del codice sorgente, l’approvazione degli artefatti e il rilascio pubblico come tre porte distinte.

Rendere deliberato il prossimo aggiornamento

Registra la versione approvata e l’URL pubblico. Le nuove modifiche sono bozze fino a quando non vengono riviste e pubblicate nuovamente.

Domande frequenti

OpenClaw ospita siti Web?

OpenClaw è l’ambiente dell’agente e dello strumento, non la destinazione di hosting pubblico qui descritta. Utilizza un host web o un artefatto dell’app pubblicato separatamente per un URL pubblico durevole. Un dashboard Gateway o un’anteprima locale non è quell’URL.

Posso pubblicare senza fornire le credenziali di produzione dell’agente?

Sì. Lascia che venga redatto e testato all’interno di un’area di lavoro limitata, quindi chiedi a una persona di utilizzare il flusso di lavoro di distribuzione del provider di hosting o il controllo Pubblica di AgentGrid.io. Anche un agente che aiuta a preparare la distribuzione non dovrebbe ricevere segreti di cui non ha bisogno.

Cosa succede se l’artefatto importato sembra corretto ma la sua forma non funziona?

Controlla se il sito originale utilizzava percorsi del server, variabili di ambiente o un servizio di terze parti che non è stato trasferito. Testa una presentazione reale nel nuovo ambiente prima del lancio. Non considerare un’anteprima visiva come una verifica funzionale.

Le modifiche nella mia cartella OpenClaw aggiorneranno il sito live?

Non automaticamente nel caso generale. L’aggiornamento dipende dalla pipeline di compilazione e distribuzione dell’host o da un aggiornamento esplicito e dalla ripubblicazione di un artefatto separato. Registra quale versione di origine rappresenta ciascun URL attivo.

Per un confronto del trasferimento, consultare la nostra guida a Procedura dettagliata per la pubblicazione di siti Web Muse. Il Claude Guida alla pubblicazione del design copre un altro punto di partenza, mentre il come gli agenti esplorano e pubblicano app con Anima mostra un elemento revisionato in fase di pubblicazione. Si tratta di flussi di lavoro diversi, non di caratteristiche del prodotto intercambiabili.