Share
Sie haben also gerade eine großartige Flash-App erstellt, die Bilder und XML-Dateien von einer anderen Domain lädt. Wenn Sie es von der IDE aus testen, funktioniert es einwandfrei, aber wenn Sie es online stellen, erhalten Sie einen dieser gefürchteten Sicherheits-Sandbox-Fehler. Was ist zu tun?
In diesem Schnelltipp zeige ich Ihnen, wie Sie einen einfachen PHP-Proxy zum fehlerfreien Laden von Bildern und XML-Dateien erstellen!
Isolierte Wolken (im perview-Symbol verwendet) von vibes35 verfügbar auf GraphicRiver.
Der Flash Player verfügt über verschiedene Sicherheits-Sandbox-Typen: fernbedienung, local-with-filesystem, lokal mit Vernetzung, und lokal vertrauenswürdig. Jeder hat seine eigenen Regeln und der Flash-Player bestimmt, welche Sandbox-Typen beim Öffnen der SWF-Datei zugewiesen werden. Wenn sich eine Datei in der Entwicklung befindet, weist die IDE automatisch einen vertrauenswürdigen Sandbox-Typ zu. Aus diesem Grund funktioniert das Projekt beim Erstellen und Testen gut, wird jedoch bei der Veröffentlichung im Web unterbrochen.
Diese Sicherheits-Sandbox-Regeln werden eingeführt, um zu verhindern, dass Hacker und Übeltäter auf Daten zugreifen, auf die sie wahrscheinlich nicht zugreifen sollten. Um dies für unsere eigenen Zwecke zu erreichen, verwenden wir die Hilfe einer PHP-Datei.
Im Folgenden versuchen wir, ein Bild zu laden und den Inhalt im Loader ohne fremde Hilfe als Bitmap zu konvertieren. Wenn die Zieldomäne keine crossdomain.xml-Datei enthält, die uns die Berechtigung gibt (die meisten Websites geben keine anonymen Berechtigungen aus), wird eine Fehlermeldung angezeigt.
Sehen? Es funktioniert überhaupt nicht. Hier ist der Code, der es unterstützt:
import flash.display.Loader; import flash.net.URLRequest; import flash.events.Event; import flash.events.MouseEvent; import flash.system.LoaderContext; import flash.system.Security; var loader: Lader; var req: URLRequest; btn_load.addEventListener (MouseEvent.CLICK, loadImage); function loadImage (e: MouseEvent): void txt_status.text = ""; req = neue URLRequest (imgPath.text); Lader = neuer Lader (); loader.contentLoaderInfo.addEventListener (Event.COMPLETE, loadComplete); loader.load (req, new LoaderContext (true)); Funktion loadComplete (e: Event): void try var img: Bitmap = neues Bitmap (); img = loader.content als Bitmap; // Hier tritt der Fehler auf catch (error: Error) txt_status.text = error.message.toString ();
PHP! PHP hat nicht die gleichen Einschränkungen wie Flash, da es sich um eine serverseitige Skriptsprache handelt - im Gegensatz zu Flash, bei dem es sich um eine clientseitige Technologie handelt. Dies ermöglicht uns, es als "mittleren Mann" zu verwenden, um Inhalte an unsere Domain zurückzugeben. Die PHP-Datei erscheint auf dem Flash-Player als der Dateityp, den wir zurückgeben. Da die PHP-Datei Daten an unsere Domäne zurückgibt, können wir den gewünschten Inhalt laden, während die Sicherheitsregeln des Flash Players eingehalten werden ... schweet!!
Auch wenn PHP den Datenabruf abdeckt, benötigen wir auch eine domänenübergreifende Richtliniendatei. Wir machen das zuerst, um es aus dem Weg zu räumen.
Wenn Sie es noch nicht wissen, handelt es sich bei einer domänenübergreifenden Richtliniendatei um eine XML-Datei, die dem anfragenden Client im Wesentlichen mitteilt: "Ja, Sie können den Inhalt meiner Domäne lesen" oder "Nein, berühren Sie nicht meine Sachen!"
(Weitere Informationen in diesem Schnelltipp.) Hier einige Beispiele aus der realen Welt:
Die erste erlaubt alle Anfragen von einer Yahoo-Subdomain wie movies.yahoo.com. Die zweite ist die gleiche, außer dass sie auch Anfragen von jeder Subdomain maps.yahooapis.com und yui.yahooapis.com zulässt. Das dritte Beispiel ist interessant, da es mit dem Platzhalter * Lesezugriff auf jede Domäne gewährt.
Nun, da wir wissen, wie sie aussehen, erstellen wir unsere eigenen. Wir benötigen es, um dem Flash-Player mitzuteilen, dass es in Ordnung ist, Daten aus unserer eigenen Domäne zu lesen.
Erstellen Sie eine neue XML-Datei im Stammverzeichnis Ihrer Website und nennen Sie sie "crossdomain.xml". Wenn Sie das getan haben, kopieren Sie einfach den untenstehenden XML-Code und ersetzen Sie "www.Ihre Domain.com" durch Ihren eigenen Domainnamen.
Dadurch wird Leseberechtigung für Anforderungen erteilt, die von Ihrer Domäne und ihren untergeordneten Domänen stammen. Wieder sollte sich diese Datei in Ihrem befinden Website-Root.
Erstellen wir eine Grundlage für unseren PHP-Proxy. Wir senden den Pfad der Datei, auf die wir zugreifen möchten, über die GET-Methode von Flash. Erstellen Sie im Stammverzeichnis Ihrer Website einen Ordner mit dem Namen "LoaderTest" und in diesem Ordner eine neue PHP-Datei mit dem Namen "proxy.php". Fügen Sie der PHP-Datei den folgenden Code hinzu:
Was macht unser Code bisher:
Accentsconagua
$ Dateiname gleich dem url Variable in unserem QuerystringIst das nicht bemerkenswert einfach? Da wir dem Header "text / xml" als Inhaltstyp hinzugefügt haben, rendert unsere proxy.php die Daten als XML. Lass es uns testen.
Navigieren Sie in Ihrer Adressleiste zur Datei proxy.php, die Sie auf Ihrer Website erstellt haben, und fügen Sie nach "/proxy.php" "url = http: //feeds.feedburner.com/flashtutssummary" hinzu. Die gesamte URL sollte folgendermaßen aussehen:
"http://www.example.com/LoaderTest/proxy.php?http://feeds.feedburner.com/flashtuts-summary"
Wenn Sie bis zu diesem Punkt alles richtig gemacht haben, sollten Sie sich einen Activetuts + RSS-Feed anschauen!
Da unsere proxy.php-Datei mehr als nur Text zurückgeben soll, müssen wir sie hinzufügen. Um den korrekten Header-Typ zurückzugeben, rufen wir die Dateierweiterungsinformationen mit Hilfe des Proxys ab pathinfo () Funktion und setze das gleich einer aufgerufenen Variablen $ ext. Danach können wir die Dateierweiterung auswerten und den richtigen Aktionspfad für diesen Dateityp festlegen. Für die Bewertung verwenden wir eine switch-Anweisung.
Wir möchten nur Bilder und Text zurückgeben, daher haben wir unserer switch-Anweisung einige allgemeine Bildtypen hinzugefügt. Bei der Dateierweiterung "jpg" besteht der erste Schritt im Hinzufügen des korrekten Attributs des Inhaltstyps für diesen Dateityp. Danach werden die Daten aus der Datei gelesen. Die Fälle "gif" und "png" enthalten identische Funktionen.
Da wollen wir Bilder zurückgeben und Text müssen wir in einem Fall arbeiten, um diesen Text zurückzugeben. Das Problem ist, dass Texte wie RSS-Feeds, XML usw. möglicherweise nicht immer eine Dateierweiterung aufweisen, wie dies bei den Bildern der Fall ist. Was ist, wenn sie dynamisch generiert werden? Wenn wir nach einer konkreten Dateierweiterung suchen, können wir sie bei dynamischen XML-Dateien leicht falsch machen und die Informationen würden nicht korrekt zurückgegeben. Die Lösung besteht darin, unseren ursprünglichen Code für die Rückgabe von Text / XML (im vorherigen Schritt) in die Standard Fall! Da alles andere, was wir zurückgeben möchten, eine bekannte Dateierweiterung hat, können wir davon ausgehen, dass wir versuchen, einen Text / XML-Typ zurückzugeben, wenn keine Dateierweiterung gefunden wird.
In Ordung! Der Moment der Wahrheit… Testzeit. Sie können versuchen, alle gewünschten Bilder aus dem Internet zu laden. Wir versuchen jedoch, in Schritt 1 dasselbe Bild wie zuvor zu laden. Hier ist noch einmal das Format:
http://www.example.com/LoaderTest/proxy.php?url=http://s3.envato.com/files/358820.jpg
Und natürlich musst du ersetzen www.example.com mit Ihrer Domain Sie sollten folgendes Ergebnis sehen:
Interessant ist auch, dass Sie den Quellcode dieser Seite nicht sehen können. Wie ich bereits erwähnt habe, ist PHP eine serverseitige Skriptsprache, daher können wir sie nicht wie HTML anzeigen. Wir sehen nur die Daten, die vom PHP-Code ausgelesen wurden. So bekommen wir den Inhalt in Flash… wir laden die PHP-Seite wie jede andere Datei!
Es folgt ein einfaches Codebeispiel, wie die Daten mithilfe des Proxys in Flash gespeichert werden.
import flash.display.Loader; import flash.net.URLRequest; import flash.events.Event; import flash.system.LoaderContext; var loader: Lader; var req: URLRequest; var proxy: String = "http://www.YOUR-WEBSITE-HERE.COM/LoaderTest/proxy.php?url="; req = new URLRequest (Proxy + "http://s3.envato.com/files/358820.jpg"); Lader = neuer Lader (); loader.contentLoaderInfo.addEventListener (Event.COMPLETE, loadComplete); loader.load (req, new LoaderContext (true)); Funktion loadComplete (e: Event): void var img: Bitmap = neues Bitmap (); img = loader.content als Bitmap; img.smoothing = true; addChild (img);
Es ist zwar möglich, Bilder von Remotedomänen ohne Proxy zu laden. Wenn Sie jedoch versuchen, direkt auf den geladenen Inhalt in Flash zuzugreifen, werden die Sicherheits-Sandbox-Fehler angezeigt. Ich habe Flash-Apps gesehen, die den Loader einfach zur Bühne hinzufügen, und es funktioniert. Wenn Sie jedoch nicht berechtigt sind, auf die Dateidaten zuzugreifen, verlieren Sie viele Optionen, um sie zu bearbeiten.
Wenn Sie vollständige Kontrolle über den Inhalt haben möchten, den Sie aus externen Quellen (die keine domänenübergreifende Richtliniendatei enthalten) in Flash laden, müssen Sie eine Art Proxy verwenden. Sogar das Anwenden der Glättung auf ein geladenes Bild erfordert Zugriff auf den Inhalt des Laders.
Das ist also alles! Ich hoffe, das hilft vielen von Ihnen, in Zukunft viele Kopfschmerzen zu vermeiden! Danke fürs Anschauen!
