Share
Entonces, acaba de crear una aplicación Flash impresionante que carga imágenes y xml de otro dominio. Cuando lo pruebas desde el IDE funciona perfectamente, pero cuando lo pones en línea, obtienes uno de esos temidos errores de violación de la zona de pruebas de seguridad. Qué hacer?
En este Consejo rápido, te mostraré cómo crear un proxy PHP simple para cargar imágenes y XML desde cualquier lugar, sin errores.!
Nubes aisladas (utilizadas en el icono de vista) por vibes35 disponible en GraphicRiver.
El reproductor Flash tiene varios tipos diferentes de entornos de seguridad: remoto, local-con-sistema de archivos, local-con-redes, y de confianza local. Cada una tiene su propio conjunto de reglas y el reproductor Flash determina cuál de los tipos de sandbox se asignará cuando se abra el SWF. Cuando un archivo está en desarrollo, el IDE asigna automáticamente un tipo de sandbox de confianza. Es por eso que al crear y probar su proyecto, funcionará bien, pero se rompe cuando se publica en la web..
Estas reglas de seguridad de la zona de pruebas se aplican para evitar que los piratas informáticos y los malhechores accedan a datos a los que probablemente no deberían acceder. Para superar esto para nuestros propios usos [legales], empleamos la ayuda de un archivo PHP.
A continuación, intentamos cargar una imagen y convertir el contenido dentro del Cargador como un mapa de bits, sin ayuda externa. Si el dominio de destino no tiene un archivo crossdomain.xml que nos dé permiso (la mayoría de los sitios no dan permisos anónimos), obtendremos un error.
¿Ver? No funciona en absoluto. Aquí está el código que lo está alimentando:
importar flash.display.Loader; importar flash.net.URLRequest; import flash.events.Event; import flash.events.MouseEvent; importar flash.system.LoaderContext; importar flash.system.Security; var loader: Loader; var req: URLRequest; btn_load.addEventListener (MouseEvent.CLICK, loadImage); function loadImage (e: MouseEvent): void txt_status.text = ""; req = new URLRequest (imgPath.text); loader = new Loader (); loader.contentLoaderInfo.addEventListener (Event.COMPLETE, loadComplete); loader.load (req, new LoaderContext (true)); function loadComplete (e: Event): void try var img: Bitmap = new Bitmap (); img = loader.content como Bitmap; // Aquí es donde se produce el error catch (error: Error) txt_status.text = error.message.toString ();
PHP! PHP no tiene las mismas restricciones que Flash porque es un lenguaje de scripting del lado del servidor, a diferencia de Flash, que es una tecnología del lado del cliente. Esto nos permite usarlo como "intermediario" para devolver contenido a nuestro dominio. El archivo PHP aparecerá en el reproductor Flash como el tipo de archivo que estamos devolviendo. Dado que el archivo PHP está devolviendo datos a nuestro dominio, podemos cargar el contenido que deseamos mientras seguimos las reglas de seguridad del reproductor Flash ... schweet!!
Aunque PHP cubre la recuperación de datos, también necesitaremos un archivo de políticas de varios dominios. Lo haremos primero para sacarlo del camino..
Si aún no lo sabe, un archivo de políticas de varios dominios es un archivo XML que básicamente le dice al cliente que realiza la solicitud "sí, puede leer el contenido de mi dominio" o "no, ¡no toque mis cosas!"
(Más información en este Consejo rápido.) Aquí hay algunos ejemplos del mundo real:
El primero permite cualquier solicitud de un subdominio de yahoo como movies.yahoo.com. El segundo es el mismo, excepto que también permite solicitudes desde cualquier subdominio de maps.yahooapis.com y yui.yahooapis.com. El tercer ejemplo es interesante porque otorga acceso de lectura a cualquier dominio utilizando el comodín *.
Ahora que sabemos cómo se ven, vamos a crear el nuestro. Lo necesitaremos para decirle al Flash Player que está bien leer datos de nuestro propio dominio..
Cree un nuevo archivo xml en la raíz de su sitio web y asígnele el nombre "crossdomain.xml". Una vez que hayas hecho eso, simplemente copia el código xml a continuación y reemplaza "www.yourdomainhere.com" con tu propio nombre de dominio.
Esto otorga permiso de lectura a las solicitudes provenientes de su dominio y sus subdominios. Una vez más, este archivo debe residir en su raíz del sitio web.
Vamos a crear una base para nuestro Proxy PHP. Enviaremos la ruta del archivo al que queremos acceder a través del método GET, desde Flash. Cree una carpeta llamada "LoaderTest" en la raíz de su sitio web y cree un nuevo archivo PHP en esa carpeta llamada "proxy.php". Agregue el siguiente código al archivo PHP:
Lo que nuestro código hace hasta ahora:
Accentsconagua
$ nombre de archivo igual a la url variable en nuestra cadena de consulta¿No es eso muy simple? Como hemos agregado "text / xml" como tipo de contenido al encabezado, nuestro proxy.php procesará los datos como xml. Vamos a probarlo.
En la barra de direcciones, navegue hasta el archivo proxy.php que creó en su sitio web y después de "/proxy.php" agregar "? Url = http: //feeds.feedburner.com/flashtuts-summary". La URL completa debe verse similar a esto:
"http://www.example.com/LoaderTest/proxy.php?http://feeds.feedburner.com/flashtuts-summary"
Si has hecho todo correctamente hasta este punto, deberías estar viendo un feed RSS de Activetuts +!
Ya que queremos que nuestro archivo proxy.php devuelva más que solo texto, tendremos que agregarlo. Para devolver el tipo de encabezado correcto, haremos que el proxy obtenga la información de extensión de archivo usando pathinfo () Funciona y establece que igual a una variable llamada $ ext. Después de eso, podemos evaluar la extensión del archivo y decidir la ruta de acción correcta para ese tipo de archivo. Para la evaluación, emplearemos una declaración de cambio..
Solo queremos devolver imágenes y texto, así que he agregado algunos tipos de imágenes generales a nuestra declaración de cambio. En el caso de la extensión de archivo "jpg", el primer paso es agregar el atributo de tipo de contenido correcto correspondiente a ese tipo de archivo. Después de eso, se leen los datos del archivo. Los casos "gif" y "png" contienen funcionalidad idéntica.
Ya que queremos devolver imágenes. y texto, tendremos que trabajar en un caso para devolver ese texto. El problema es que el texto como rss feeds, xml, etc. no siempre tiene una extensión de archivo como las imágenes. ¿Y si se generan dinámicamente? Si buscáramos una extensión de archivo concreta, podríamos equivocarnos fácilmente en el caso de un xml dinámico y no devolvería la información correctamente. La solución es simplemente introducir nuestro código original para devolver texto / xml (en el paso anterior) a la defecto ¡caso! Dado que todo lo demás que estamos intentando devolver tendrá una extensión de archivo conocida, si no se encuentra ninguna extensión de archivo, podemos asumir que estamos intentando devolver un tipo de texto / xml.
¡Bien! El momento de la verdad ... tiempo de prueba. Puede intentar cargar las imágenes que desee desde la web, pero intentaremos cargar la misma imagen que antes, en el Paso 1. Aquí está el formato una vez más:
http://www.example.com/LoaderTest/proxy.php?url=http://s3.envato.com/files/358820.jpg
Y por supuesto, necesitarás reemplazar www.ejemplo.com con tu dominio Deberías ver el siguiente resultado:
Además, algo interesante que notará es que no puede ver la fuente de esta página. Como mencioné anteriormente, PHP es un lenguaje de script del lado del servidor, por lo que no podemos verlo como html. Todo lo que estamos viendo son los datos que fueron leídos por el código PHP. Así es como obtenemos el contenido en Flash ... cargamos la página de PHP como cualquier otro archivo!
A continuación se muestra un ejemplo de código simple de cómo llevar los datos a flash usando el proxy.
importar flash.display.Loader; importar flash.net.URLRequest; import flash.events.Event; importar flash.system.LoaderContext; var loader: Loader; 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"); loader = new Loader (); loader.contentLoaderInfo.addEventListener (Event.COMPLETE, loadComplete); loader.load (req, new LoaderContext (true)); función loadComplete (e: Evento): void var img: Bitmap = new Bitmap (); img = loader.content como Bitmap; img.smoothing = true; addChild (img);
Si bien es posible cargar imágenes desde dominios remotos sin el uso de un proxy, es cuando intentas acceder directamente a ese contenido cargado en flash que obtendrás los errores de la caja de seguridad. He visto aplicaciones Flash que solo agregan el cargador al escenario, y funciona; sin embargo, si no tiene permiso para acceder a los datos del archivo, pierde muchas opciones para manipularlo.
Si desea tener un control total sobre el contenido que carga en Flash desde fuentes externas (que no tienen un archivo de políticas de dominio cruzado abierto), deberá usar algún tipo de proxy. Incluso algo como aplicar suavizado a una imagen cargada requiere acceso al contenido del cargador.
Así que eso es todo lo que hay que hacer! Espero que esto ayude a muchos de ustedes a evitar muchos dolores de cabeza en el futuro! Gracias por ver!
