Hai mai desiderato fare uno screenshot della pagina web di un utente? Forse per consentire una più semplice correzione dei bug o per l'utente intmiglioramenti della superficie? Beh, puoi farlo GrabzÈ l'API JavaScript.
Per acquisire una pagina utente è necessario utilizzare il file ConvertPage
metodo. Questo ci invia il contenuto della pagina degli utenti da convertire into un'immagine, PDF, DOCX o qualsiasi altra cosa supportata. È importante ricordare che qualsiasi risorsa come CSS o immagini non può essere caricata se non nello screenshot a meno che non sia disponibile pubblicamente. Tuttavia di solito è così.
Il semplice esempio seguente mostra quanto sia facile eseguire lo screenshot della pagina Web di un utente utilizzando la libreria di GrabzIt. Basta posizionare il codice in fondo alla pagina che desideri acquisire.
<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@3.5.2/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertPage().Create();
</script>
Tieni presente che puoi superarne qualsiasi parametri consente dall'API JavaScript al ConvertPage
metodo, per personalizzare ulteriormente il tuo screenshot. Ad esempio, nell'esempio seguente rendiamo lo screenshot della stessa larghezza della pagina web dell'utente, catturandone l'intera altezza.
<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@3.5.2/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertPage({
"bwidth":document.documentElement.clientWidth,
"bheight": -1,
"height": -1,
"width": -1
}).Create();
</script>
Gli esempi precedenti tuttavia sono limitati in quanto sarà necessario attivare l'acquisizione di una pagina Web in seguito a un evento di qualche tipo, anziché acquisire la pagina solo quando la pagina Web viene caricata. Ad esempio, due potenziali alternative potrebbero essere l'acquisizione della pagina Web con il clic di un pulsante o con cadenza regolare intervals con un timer.
<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@3.5.2/grabzit.min.js"></script>
<script>
setTimeout(function(){
GrabzIt("Sign in to view your Application Key").ConvertPage({
"bwidth":document.documentElement.clientWidth,
"bheight": -1,
"height": -1,
"width": -1
}).CreateInvisible();
}, 30000);
</script>
Nell'esempio sopra creiamo automaticamente uno screenshot della pagina web dell'utente ogni 30 secondi. Ma invece di aggiungere lo screenshot alla pagina Web dell'utente o scaricarlo, come accade nel file Create
il metodo utilizzato negli esempi precedenti andrebbe bene, a seconda del formato. IL CreateInvisible
viene utilizzato il metodo, che non restituirà un risultato all'utente.
È quindi possibile save lo screenshot di JavaScript utilizzando uno dei seguenti metodi. Il parametro di esportazione per esportare il risultato su Amazon, Dropbox, FTP o altro. Oppure puoi utilizzare l'evento di finitura per chiamare un servizio Web save il risultato, o il DataURI
metodo per pubblicare il risultato su un servizio web.
Ovviamente è ovvio che probabilmente dovrai informare i tuoi utenti che lo stai facendo.
Puoi iniziare a fare screenshot della pagina web corrente gratuitamente, tramite creare un account e copiare il codice sopra into una pagina Web che desideri acquisire. Ricorda che per assicurarti che altre persone non utilizzino il tuo account devi autorizza il tuo dominio prima che funzioni sul tuo sito web.