Recibí un error al implementar el siguiente código dentro del cuerpo:
<div id="fb-root"></div> <div id="fb-customer-chat" class="fb-customerchat"> </div> <script> var chatbox = document.getElementById('fb-customer-chat'); chatbox.setAttribute("page_id", "YOURPAGEIDHERE"); chatbox.setAttribute("attribution", "biz_inbox"); window.fbAsyncInit = function() { FB.init({ xfbml : true, version : 'v12.0' }); }; (function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = 'https://connect.facebook.net/en_US/sdk/xfbml.customerchat.js'; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk')); </script>Ya incluí los dominios en la lista blanca dentro de FB Advanced Messaging. No estoy seguro si me perdí algo más en el código.
En la página de configuración > mensajería avanzada > Dominios incluidos en la lista blanca. Agrega tu dominio. Verifica si tu dominio está en https o http.
Después, vaya al panel de complementos de configuración> configure y agregue su dominio.
Uno de los requisitos de Facebook es tener un dominio HTTPS. No se aceptará HTTP.
También estaba recibiendo estos errores. Descubrí que el ID de página que estaba usando era incorrecto 🤦♀️. Estos errores ocurren solo cuando su ID de página es incorrecta o el dominio no está en la lista blanca correctamente (incluso probé con una URL de ngrok y funcionó 😵).
Así que los pasos que seguí fueron-
1) En buisness.facebook.com, vaya a la bandeja de entrada desde la barra lateral y seleccione el complemento de chat. [https://i.stack.imgur.com/rDk5d.png]
2) Haga clic en configurar para agregar su dominio. [https://i.stack.imgur.com/exOi2.png]
3) Elija un método de configuración (estándar para react/nextjs) y configure el complemento de chat (agregue idioma, dominio, copie el código y péguelo) [https://i.stack.imgur.com/hDArZ.png]
4) Puede agregar varios dominios [https://i.stack.imgur.com/zGdgx.png]
5) Obtendrá el ID de página ya incrustado [https://i.stack.imgur.com/iRT13.png]
use este código y péguelo en el archivo _document.js en nextjs. y después de implementarlo funcionará perfectamente. Para cualquier confusión por favor hágamelo saber. Gracias, feliz codificación ☺