In che modo i servizi ospitati come UserVoice incorporano il loro contenuto su altri siti Web?

Question

In che modo i servizi ospitati come UserVoice incorporano il loro contenuto su altri siti Web?

Vedo che è tramite l'inclusione di un file JavaScript dal fornitore di servizi sulla tua pagina, tuttavia, ciò che mi interessa sono i mattoni per la creazione di un servizio del genere.

Ad esempio, usano una libreria come jQuery, mooTools o prototypejs e come evitano gli scontri con lo spazio dei nomi?

Mi chiedevo anche se c'erano libri, articoli, post di blog che riguardavano questo specifico uso di JavaScript (non cercavo risorse generali su JavaScript).

Saluti e grazie in anticipo,

Eliot

Answer 1

Ecco un ottimo tutorial che ho trovato su Come creare un widget web (usando jQuery)

Answer 2

Generalmente, quello che stai descrivendo è chiamato "Widget Javascript" (UserVoice si presenta solo sul lato della pagina).

Esiste un buon tutorial su creazione di widget JavaScript che puoi consultare.

Answer 3

La struttura di base di tale servizio incorporabile sarebbe:

1. Se il servizio non impone che lo script debba essere incluso nella parte inferiore della pagina, agganciare l'evento body onload, senza calpestare le dita dei gestori esistenti (intercettando la funzione gestore esistente, che potrebbe diventa incatenato ad altre funzioni).
2. Inietta nuovi elementi HTML nel documento. Molto probabilmente il codice HTML verrebbe inserito nello script come letterale stringa poiché l'impostazione di innerHTML su un singolo elemento iniettato sarebbe più semplice e veloce della manipolazione diretta del DOM usando una raffica di chiamate di funzione.
3. L'intero script dovrebbe vivere all'interno di una chiusura per evitare conflitti di nomi.
4. Un framework JS può o non può essere utilizzato; è necessaria cautela quando si include un framework poiché potrebbe scontrarsi con un framework preesistente, diverso o con una versione diversa dello stesso framework.

Answer 4

EDT: generalmente fai in modo che il tuo cliente / cliente / amico includa uno script nella loro pagina, quindi tramite quello script puoi fare quanto segue:

In JS puro è possibile caricare gli script da una posizione remota (o non così remota) in modo dinamico tramite

   var script = document.createElement('script');
   script.type = 'text/javascript';
   script.src = 'your/remote/scripts/path.js';
   document.getElementsByTagName('body')[0].appendChild(script);

// $ .getScript ('your / remote / scripts / path.js'); in jquery ma sarai sicuro che jQuery è stato caricato sul sito remoto

Quindi lo script che hai caricato può eseguire diverse azioni come la creazione di elementi come questo

var body = document.getElementsByTagName ('body') [0]; var aDiv = document.createElement ('script'); / * qui puoi modificare le proprietà dei tuoi div e guardare * / body.appendChild (Adiv); // $ (''). appendTo ('body'); per jQuery

Per approfondire JavaScript puoi leggere ad esempio Javascript: The Good Parts o Guida definitiva a Javascript .