Instagram embeds.js Bibliothek wird nicht geladen

Question

Ich habe eine JavaScript-Funktion, die den HTML-Code für einen Instagram-Beitrag lädt. Der Beitrag erscheint, aber das Foto wird durch einen grauen Hintergrund und das Instagram-Logo ersetzt. Der Post enthält andere Informationen wie Hashtags, Zeit gebucht und Benutzername. Ich glaube, dass das Problem darin besteht, dass die Javascript-Bibliothek instagram embeds.js nicht richtig geladen wird. Ich bin mir bewusst, dass ich das manuell tun kann, habe aber Schwierigkeiten damit, dies in Bezug auf Syntax und Platzierung in meinem Code zu tun. Unten ist mein Code.

 <script type="text/javascript"> 
     var auto_refresh = setInterval(
     (function() { 
      $("#latestData").load("displayPost.php");//displayPost.php "echo" html embed code 
     }), 10000); 
    </script> 

<div id="latestData"></div> 
    <script src="https://platform.instagram.com/en_US/embeds.js"></script> 
    <script>if (typeof window.instgrm !== 'undefined') { 
     window.instgrm.Embeds.process(); 
    }</script> 

Ich habe diese verwendet, um zu versuchen, dieses Problem zu lösen.

Instagram embeds not working when adding embeds dynamically

https://wordpress.stackexchange.com/questions/170857/problems-using-wps-oembed-function-instagram-ajax

https://instagram.com/developer/embedding/?hl=en

Answer 1

Dies geschieht, weil Sie nicht richtig sind Ihre Reihenfolge der Ausführung zu strukturieren. Sie sollten zuerst Ihren Einbettungscode laden, dann in einem Rückruf Anruf instgrm.Embeds.process(). Stellen Sie sicher, dass Sie embeds.js nicht bei jedem Einbetten einschließen, indem Sie OMITSCRIPT=true an Ihre Einbettungs-URL anhängen. Fügen Sie stattdessen die embeds.js einmal in einem Skript-Tag auf Ihrer Seite ein.