Schneller Tipp Domainübergreifende AJAX-Anforderung mit YQL und jQuery

Aus Sicherheitsgründen können wir mit jQuery keine domänenübergreifenden AJAX-Anforderungen erstellen. Zum Beispiel kann ich die load () -Methode nicht aufrufen und 'cnn.com' übergeben. Da wir Skripte und ähnliches sowie unseren gewünschten Inhalt laden würden, wäre dies ein erhebliches Sicherheitsrisiko. Trotzdem kann es Zeiten geben, in denen dies genau das ist, was Sie benötigen. Dank YQL können wir diese Funktionalität ziemlich einfach berücksichtigen!


Abonniere unsere YouTube-Seite, um alle Video-Tutorials anzusehen!

Das Skript

 // Akzeptiert eine URL und eine Callback-Funktion zur Ausführung. Funktion requestCrossDomain (Site, Callback) // Wenn keine URL übergeben wurde, beenden Sie das Programm. if (! site) alert ('Keine Site wurde übergeben.'); falsch zurückgeben;  // Nehmen Sie die angegebene URL und fügen Sie sie einer YQL-Abfrage hinzu. Stellen Sie sicher, dass Sie es kodieren! var yql = 'http://query.yahooapis.com/v1/public/yql?q=' + encodeURIComponent ('select * from html Dabei ist url = "' + site + '' ') +' & format = xml & callback = cbFunc '; // Fordere diese YSQL-Zeichenfolge an und führe eine Rückruffunktion aus. // Übergeben Sie eine definierte Funktion, um Cache-Busting zu verhindern. $ .getJSON (yql, cbFunc); function cbFunc (data) // Wenn wir etwas zu tun haben mit… if (data.results [0]) // Alle Skript-Tags aus Sicherheitsgründen entfernen. // SEI SEHR VORSICHTIG. Das hilft, aber wir sollten mehr tun. Daten = Daten.Ergebnisse [0] .replace (/] *> [\ s \ S] *?<\/script>/ gi, "); // Wenn der Benutzer einen Rückruf übergeben hat und // eine Funktion ist, rufen Sie ihn auf und senden Sie ihn über die Datenvariable. if (typeof callback === 'function') callback (data);  // Else, Vielleicht haben wir eine Website angefordert, die nicht existiert, und nichts wurde zurückgegeben. Sonst wird neuer Fehler ausgegeben ('Nichts wurde von getJSON zurückgegeben.');

Rufen Sie die Funktion auf

 requestCrossDomain ('http://www.cnn.com', Funktion (Ergebnisse) $ ('# container'). html (Ergebnisse););

Die Script-Tags entfernen

Ich musste im Video ziemlich schnell vorankommen, also vielleicht den regulären Ausdruck, der das ausblendet , oder . Aus diesem Grund fügen wir eine Zeichenklasse ([^>] *) hinzu, die Folgendes bedeutet: "Suche null oder mehr von etwas, das KEINE schließende Klammer ist. Dadurch werden die Attribute und Werte berücksichtigt.

 [\ s \ S] *?

Als Nächstes möchten wir den gesamten Code sowie alle Abstände entfernen. \ s bezieht sich auf ein Leerzeichen. \ S bezieht sich auf alles, was NICHT ein Leerzeichen ist. Wieder fügen wir ein * nach der Zeichenklasse, um anzugeben, dass wir keine oder mehrere Vorkommen haben möchten.

 <\/script>

Finden Sie schließlich die schließenden Skript-Tags.


Lesen Sie weiter

  • Eine API für das Web: YQL lernen

Dies soll nur einen Einblick geben, wie wir diese Funktionalität erreichen können. Nur so viel kann in einem fünfminütigen Video gezeigt werden. Fühlen Sie sich frei, in den Kommentaren zu diskutieren, und Sie werden immer aufgefordert, den Quellcode zu bündeln, um ihn zu verbessern!