Ich versuche, die Youtube Iframe API in einem Modul mit Require JS zu verwenden. Da diese API async geladen ist und eine Funktion aufruft, sobald sie geladen ist, habe ich ein requireJS-Plugin namens "async" verwendet, das zuvor mit google maps api gearbeitet hat.
Allerdings funktioniert diesmal etwas nicht. Mein Modul beginnt folgendermaßen:
define(['text!fmwk/widgets/video/video.html','fmwk/utils/browser','async!http://www.youtube.com/iframe_api'], function (videoTpl,root) { ... });
und die Chrome-Konsole löst diesen Fehler aus:
Uncaught Error: Load timeout for modules: async!http://www.youtube.com/iframe_api_unnormalized3,async!http://www.youtube.com/iframe_api
http://requirejs.org/docs/errors.html#timeout
Wenn ich kein asynchrones Plugin verwende, sind das Objekt YT oder seine Funktionen nicht definiert, und dasselbe passiert, wenn ich den API-Code herunterlade. Die API wird manchmal geladen, wenn ich ein Skript-Tag in das head-Tag der HTML-Datei lege. All das wird erwartet, aber ich verstehe das nicht, weil das asynchrone Plugin fehlschlägt.
Danke für Ihre Aufmerksamkeit und Hilfe:)
Ich kenne das Plugin async requireJS nicht, aber hier ist ein Beispielcode (aus YouTube Direct Lite ), das die iframe-API asynchron aus einem requireJS-Modul namens player lädt. Es wird jQuery verwendet, um das Laden der Bibliothek durchzuführen.
Nach einigen Nachforschungen und unzufrieden mit den anderen Antworten, habe ich das für diesen genauen Fall plus mögliche andere ohne den zusätzlichen Flaum gelöst, indem ich den async-Request erweitert habe! Plugin, um einen benannten Callback zu unterstützen, der dann sicherstellt, dass der Modulcode nur ausgeführt wird, sobald die API vollständig geladen ist.
Das Kernproblem scheint zu sein, dass die YouTube Iframe-API es nicht erlaubt, den Callback-Namen zu konfigurieren, sondern diktiert, dass es "onYouTubeIframeAPIReady" ist, was unser kleines Upgrade auf das asynchrone Plugin löst. Diese Lösung verwendet weiterhin das globale window.YT, funktioniert aber ohne jQuery.
%Vor%Funktioniert auch mit Inline-Requests:
%Vor%Der Code ist meiner Meinung nach viel sauberer als je zuvor. Außerdem waren die Leistungsverbesserungen durch das Laden der API im letzten Moment enorm, besonders wenn sie mit Dutzenden von Spielern verwendet wurden. Die API wird natürlich nur einmal geladen und wie gewohnt zwischengespeichert.
Aktualisiert! asynchrones Plugin: Ссылка
Pull-Anfrage für das Upgrade! async-Plugin: Ссылка
Das Upgrade sollte vollständig abwärtskompatibel sein Warum gibt es diesen hässlichen undefinierten als ersten Plugin-Parameter. Irgendwelche Ideen, wie man das schöner und einfacher machen kann, sind sehr willkommen.
Schritt 1: Erfordern Sie YouTube ohne einen Extension
Schritt 2: Hängen Sie die Funktion onYouTubeIframeAPIReady an das Fensterobjekt an
Schritt 3: Laden Sie asynchron das Skript
Dies wird Ihre onYouTubeIframeAPIReady -Funktion auslösen und Sie sind im Geschäft
Tags und Links javascript requirejs youtube-api