Hola @yaurimelissa
Gracias por postear tu pregunta.
Hay varias formas de hacer esta tarea, pero creo q la forma mas comun (por ejemplo es la q usa el widget de facebook y el chat de intercom). Es inyectando dinamicamente una etiqueta <script>
al codigo cliente onload
.
Tu cliente debe insertar en su pagina algo del estilo (copiado de intercom):
<script>
(function () {
var tuFuncion = window.TuVariableGlobal;
if (typeof tuFuncion === "function") { // si ya esta cargado el widget
// haces lo que sea necesario para volver a mostrar tu widget on load
// esto es lo que hace intercom
tuFuncion('reattach_activator');
tuFuncion('update', window.intercomSettings);
} else {
var tuFuncionNueva = function () {
// aqui haces lo que haga falta del lado del cliente antes de
// cargar el script. Este es el mecanismo de comunicacion
// entre el HTML de tu cliente y el script dinamico que vas a inyectar
// Puede ser que en tu caso no sea necesario de implementar. Evalualo.
// Por ejemplo, si tu cliente tiene un `client_apikey`
// aqui es donde lo jalas al global para que este disponible
// en el script que vas a cargar de manera asincrona mas adelante
// o lo que notes que sea necesario
};
window.TuVariableGlobal = tuFuncionNueva;
var load = function () {
// creas dinamicamente el tag script
var scriptTag = document.createElement('script');
scriptTag.type = 'text/javascript';
scriptTag.async = true;
scriptTag.src = 'https://widget.intercom.io/widget'; // <-- en este archivo esta la magia.
// alli creas el elemento de manera dinamica y
// le asignas los estilos, la funcionalidad, etc.
var x = document.getElementsByTagName('script')[0]; // inyectas tu codigo antes que el resto de los scripts
x.parentNode.insertBefore(scriptTag, x);
};
// ejecutas la instalacion onload
if (window.attachEvent) { // IE8 o inferior
window.attachEvent('onload', load);
} else { // navegadores como la gente
window.addEventListener('load', load, false);
}
}
})();
</script>
Ten en cuenta que este codigo esta des-minificado, es fundamental que el scriptlet que instale tu cliente sea pequeño y casi criptico.
Te recomiendo que hagas el trabajo de ingenieria inversa en alguna solucion de la cual te quieras inspirar, para ver como lo hacen los “monstruos” de la industria.
Nos cuentas cómo te va y aqui estamos por si tienes mas preguntas
Saludos!