Share
Så, du har just skapat en fantastisk Flash-app som laddar bilder och xml från en annan domän. När du testar det från IDE fungerar det perfekt, men när du lägger det på nätet får du en av de fruktade felsäkerhetssandboxfel. Vad ska man göra?
I denna Snabba Tips, visar jag dig hur du skapar en enkel PHP-proxy för att ladda bilder och XML från var som helst, felfri!
Isolerade moln (används i perview-ikonen) av vibes35 som finns tillgänglig på GraphicRiver.
Flash-spelaren har några olika säkerhetssandboxtyper: avlägsen, lokal-med-filsystem, lokal-med-nätverk, och lokal-tillförlitlig. Var och en har sin egen uppsättning regler och Flash-spelaren bestämmer vilken av de sandboxtyper som ska tilldelas när SWF öppnas. När en fil är under utveckling, tilldelar IDE automatiskt en pålitlig sandboxtyp. Det är därför som du skapar och testar ditt projekt, det fungerar bra, men det går rast när det publiceras på webben.
Dessa säkerhets sandbox regler är införda för att förhindra hackare och evildoers från att få tillgång till data som de förmodligen inte skulle komma åt. För att få detta för våra egna [juridiska] användningsområden använder vi hjälp av en PHP-fil.
Nedan försöker vi ladda en bild och kasta innehållet i Loader som en bitmapp utan någon hjälp utanför. Om måldomänen inte har en crossdomain.xml-fil som ger oss tillstånd (de flesta webbplatser ger inte anonyma behörigheter) kommer vi att få ett fel.
Se? Det fungerar inte alls. Här är koden som driver den:
importera flash.display.Loader; importera flash.net.URLRequest; importera flash.events.Event; importera flash.events.MouseEvent; importera flash.system.LoaderContext; importera flash.system.Security; var loader: Loader; var req: URLRequest; btn_load.addEventListener (MouseEvent.CLICK, loadImage); funktion loadImage (e: MouseEvent): void txt_status.text = ""; req = ny URLRequest (imgPath.text); Loader = Ny Loader (); loader.contentLoaderInfo.addEventListener (Event.COMPLETE, loadComplete); loader.load (req, nya LoaderContext (true)); funktion loadComplete (e: Event): void försök var img: Bitmap = new Bitmap (); img = loader.content som Bitmap; // Här är var felet uppstår fånga (fel: Fel) txt_status.text = error.message.toString ();
PHP! PHP har inte samma begränsningar som Flash eftersom det är ett skriptspråk på serverns sida - till skillnad från Flash, vilket är en klientsideteknik. Detta gör det möjligt för oss att använda den som en "medelmänniska" för att returnera innehåll till vår domän. PHP-filen visas för Flash-spelaren för att vara vilken typ av fil som vi återvänder. Eftersom PHP-filen returnerar data till vår domän kan vi ladda innehållet vi vill ha, samtidigt som vi följer Flash-spelarens säkerhetsregler ... schweet!!
Även om PHP täcker datainhämtningen, behöver vi också en policyfil med tvärdomän. Vi gör det först för att få det ur vägen.
Om du inte redan vet, är en fil med korsdomänpolicy en XML-fil som i princip berättar den begärande klienten, "Ja, du kan läsa min domän innehåll" eller "Nej, rör inte mina saker!"
(Mer information i denna snabba tips.) Här är några exempel på verkligheten:
Den första tillåter eventuella förfrågningar från en yahoo-underdomän som movies.yahoo.com. Den andra är densamma, förutom att det också tillåter förfrågningar från någon maps.yahooapis.com subdomän, och yui.yahooapis.com. Det tredje exemplet är intressant eftersom det ger läsåtkomst till någon domän med hjälp av * jokertecken.
Nu när vi vet hur de ser ut, låt oss skapa vår egen. Vi behöver det för att berätta för Flash-spelaren att det är okej att läsa data från vår egen domän.
Skapa en ny xml-fil i roten till din webbplats och namnge den "crossdomain.xml". När du har gjort det, kopiera bara xml-koden nedan och ersätt "www.yourdomainhere.com" med ditt eget domännamn.
Dessa bidrag ger läs tillstånd till förfrågningar som kommer från din domän och dess underdomäner. Återigen borde den här filen ligga i din webbplats rot.
Låt oss skapa en grund för vår PHP-proxy. Vi skickar sökvägen till filen vi vill komma åt via GET-metoden, från Flash. Skapa en mapp med namnet "LoaderTest" i roten till din webbplats och skapa en ny PHP-fil i den mappen heter "proxy.php". Lägg till följande kod i PHP-filen:
Vad vår kod gör så långt:
Accentsconagua
$ filnamn lika med url variabel i vår frågesträngÄr inte det anmärkningsvärt enkelt? Eftersom vi har lagt till "text / xml" som innehållstyp till rubriken kommer vår proxy.php att göra data som xml. Låt oss testa det.
Navigera till den proxy.php-fil du skapade på din webbplats i adressfältet och efter "/proxy.php" lägg till "? Url = http: //feeds.feedburner.com/flashtuts-summary". Hela webbadressen ska likna följande:
"Http://www.example.com/LoaderTest/proxy.php?http://feeds.feedburner.com/flashtuts-summary"
Om du har gjort allt rätt till denna punkt bör du titta på ett Activetuts + RSS-flöde!
Eftersom vi vill att vår proxy.php-fil ska returnera mer än bara text, måste vi lägga till den. För att returnera rätt rubrikstyp får vi proxyn hämta filtilläggsinformationen med hjälp av pathinfo () funktion och set som lika med en variabel som heter $ ext. Därefter kan vi utvärdera filtillägget och bestämma rätt åtkomstväg för den filtypen. För utvärderingen använder vi en omkopplingsrapport.
Vi vill bara återvända bilder och text, så jag har lagt till några generella bildtyper i vårt omkopplingsdeklaration. När det gäller filtillägget "jpg" är det första steget att lägga till den korrekta innehållstypattributet för den typen av fil. Därefter läses data från filen. "Gif" och "png" fallen innehåller identisk funktionalitet.
Eftersom vi vill återvända bilder och text, vi måste arbeta i ett fall för att returnera den texten. Problemet är att den texten som rss-flöden, xml etc. kanske inte alltid har en filtillägg som bilderna gör. Vad händer om de genereras dynamiskt? Om vi skulle leta efter en konkret filtillägg, då kan vi enkelt få fel när det gäller dynamisk xml och det skulle inte returnera informationen korrekt. Lösningen är bara att dyka upp vår ursprungliga kod för att returnera text / xml (i föregående steg) till standard fall! Eftersom allt annat vi försöker återvända kommer att ha en känd filtillägg, om ingen filtillägg hittas kan vi anta att vi försöker returnera en text / xml-typ.
OK! Sanningens ögonblick ... testtid. Du kan försöka ladda alla bilder du vill ha från webben, men vi försöker ladda samma bild som tidigare, i steg 1. Här är formatet en gång till:
http://www.example.com/LoaderTest/proxy.php?url=http://s3.envato.com/files/358820.jpg
Och självklart måste du byta ut www.example.com med din domän Du bör se följande resultat:
Det är också intressant att du märker att du inte kan visa källan till den här sidan. Som jag nämnde tidigare är PHP ett skriptspråk på serverns sida, så vi kan inte se det som html. Allt vi ser är de data som lästes ut av PHP-koden. Så här får vi innehållet till Flash ... vi laddar PHP-sidan precis som någon annan fil!
Nedan följer ett enkelt kodexempel på hur du tar med data till flash med hjälp av proxyn.
importera flash.display.Loader; importera flash.net.URLRequest; importera flash.events.Event; importera flash.system.LoaderContext; var loader: Loader; var req: URLRequest; var proxy: String = "http://www.YOUR-WEBSITE-HERE.COM/LoaderTest/proxy.php?url="; req = ny URLRequest (proxy + "http://s3.envato.com/files/358820.jpg"); Loader = Ny Loader (); loader.contentLoaderInfo.addEventListener (Event.COMPLETE, loadComplete); loader.load (req, nya LoaderContext (true)); funktion loadComplete (e: Event): void var img: Bitmap = ny Bitmap (); img = loader.content som Bitmap; img.smoothing = true; addChild (img);
Medan det är möjligt att ladda bilder från fjärrdomäner utan att använda en proxy, är det när du försöker få direkt tillgång till det laddade innehållet i blixt som du får fel på säkerhetssandlådan. Jag har sett Flash-appar som bara lägger till lastaren till scenen, och det fungerar. Om du inte har behörighet att komma åt fildata misslyckas många alternativ för att manipulera det.
Om du vill ha total kontroll över innehållet som du laddar in i Flash från externa källor (som inte har en öppen policy för överdomäner) måste du använda någon form av proxy. Till och med något som att applicera utjämning till en laddad bild kräver åtkomst till lastarens innehåll.
Så det är allt det finns! Jag hoppas det hjälper många av dig att undvika många huvudvärk i framtiden! Tack för att du tittat på det!
