Home Portfolio C.V. Download Signez-le ! Contact


Flash
Charger un fichier distant
Lorsque l'on commence à faire un peu de flash dynamique, et que l'on comprend tout le potentiel de charger des fichiers externes (php, flux rss, etc...), on se heurte vite à certains obstacles !

Dans ce billet, je vais aborder l'obstacle du chargement interdomaine et une manière d'outrepasser cette limitaion.

Preface
Flash et la securité
Pour certaines raisons, flash ne permet pas l'execution et le chargement de certains fichiers provenant d'un domaine different de celui qui l'appel. Certains d'entre vous ce sont surement déjà retrouver "coincés" en voulant charger un flux rss distant dans un swf. C'est parfois assez frustrant ! Car on peut tout à fait charger une image distante, mais rien d'autre .... pourtant charger un xml distant ne presente pas vraiment plus de risque que charger une image ...
Solution du fichier "crossdomain.xml"
Flash a penser à nous ! En permettant de creer des règles d'autorisation interdomaine.

En theorie celà signifie, que via un fichier de règle ("crossdomain.xml") placé sur un domaine distant, on peut autoriser ou pas l'accès aux fichiers de ce domaine depuis le domaine où votre swf est hebergé ...

En pratique celà implique que vous devez posseder les "clés" du domaine distant pour pouvoir y deposer votre fichier "crossdomain.xml" ! Evidement celà complique beaucoup les choses, vous vous voyez envoyer un mail à microsoft pour leur dire de mettre un fichier crossdomain sur leur serveur pour que vous puissiez acceder à leur fichier depuis votre domaine !?!
Solution via l'intermediaire d'un script php
C'est cette methode que je vais vous expliquer. Ne soyez pas effrayez par le mot php (certain y font une allergie), ce script sera casi invisible pour vous, mais il va vous faciliter la vie !

En gros, je vais utiliser un scrip php pour faire une passerelle entre votre swf et le fichier distant.

Votre flash envoi l'url distante au script php, le php recupère le fichier distant, flash recupère le resultat du php (donc le fichier distant, vous avez compris le principe).
Le script php: "secu_flash.php"
<?php
//On verifie que l'on a bien reçu la variable venant de flash
if(!isset($_GET["maVariable"])) {
	//si vide on arrète le script
	die( "Error" );
}
//si votre .php n'est pas encodé en utf-8, decommentez la ligne suivante et supprimer l'autre echo
//echo utf8_encode(file_get_contents($_GET["maVariable"]));
//et si votre php est encodé en utf8, si pas supprimer la ligne suivante et decommenter la ligne precedente
echo file_get_contents($_GET["maVariable"]);
?>
Explications
Vous voyez, il n'est pas si compliqué, à peine 2-3 lignes de code suffisent.
Si vous avez des soucis avec les accents, supprimez la dernière ligne et decommentez la ligne "//echo utf8_encode ..."
Mettez ce code dans un fichier nommé "secu_flash.php", et placez le dans le mème dossier que votre swf
Exemple n°1: recuperation d'un flux rss se trouvant sur un domaine distant
/********************************************************
 
  Creation et paramètres du champs de texte recepteur
 
*********************************************************/
//Creation du champs de texte
var txt_html:TextField = this.createTextField("txt_html", this.getNextHighestDepth(), 0, 0, Stage.width, Stage.height);
//Champs de texte multiligne
this.txt_html.multiline = true;
//On active le retour à la ligne automatique
this.txt_html.wordWrap = true;
//On supprime les blancs inutiles
this.txt_html.condenseWhite = true;
//On active le rendu html
this.txt_html.html = true;
/********************************************************
 
  Declaration de variables
 
*********************************************************/
//On crée une reference à _root (pour le ciblage)
var root:MovieClip = this;
//On defini l'url de base de notre swf
var adresse_swf:String = _url.substring(0, _url.split(".swf")[0].lastIndexOf("/")+1);
/********************************************************
 
  Chargement d'un flux rss distant
 
*********************************************************/
//Url du flux distant à charger
var autre_url:String = "http://blog.ka-studio.net/atom.php";
//Declaration d'un nouvel objet xml
var reviews_xml:XML = new XML();
//On ignore les blancs
this.reviews_xml.ignoreWhite = true;
//Lors de l'appel du fichier
this.reviews_xml.onLoad = function(success:Boolean):Void  {
	if (success) {
		//si le flux rss est chargé alors...
		root.txt_html.htmlText = "Chargement du flux "+root.autre_url+"<br /><br /><br />";
		//on boucle et on affiche quelques sujets
		for (var i:Number = 9; i<15; i++) {
			root.txt_html.htmlText += "<br /><br />"+root.reviews_xml.firstChild.childNodes[i].childNodes[0].childNodes[0].nodeValue;
			root.txt_html.htmlText += "<br /><br />"+root.reviews_xml.firstChild.childNodes[i].childNodes[6].childNodes[0].nodeValue+"<br /><br />---------------------------------------------";
		}
	} else {
		//et si le flux rss n'est pas trouvé
		root.txt_html.htmlText = "Impossible de charger le fichier";
	}
};
//Url du flux a charger ! Ici on charge en fait le script php, avec l'url du flux en paramètre
this.reviews_xml.load(root.adresse_swf+"secu_flash.php?maVariable="+root.autre_url);
Explications
Cet exemple va donc creer un champs de texte au format html, et y placer une partie de notre flux distant
La variable adresse_swf est malheureusement indispensable, cette variable fait référence à l'url du dossier contenant notre swf, sans ça, flash risque de ne pas charger notre script php.
Exemple n°2: recuperation de certaines données contenu dans une page html distante
/********************************************************
 
  Creation et paramètres du champs de texte recepteur
 
*********************************************************/
//Creation du champs de texte
var txt_html:TextField = this.createTextField("txt_html", this.getNextHighestDepth(), 0, 0, Stage.width, Stage.height);
//Champs de texte multiligne
this.txt_html.multiline = true;
//On active le retour à la ligne automatique
this.txt_html.wordWrap = true;
//On supprime les blancs inutiles
this.txt_html.condenseWhite = true;
//On active le rendu html
this.txt_html.html = true;
/********************************************************
 
  Declaration de variables
 
*********************************************************/
//On crée une reference à _root (pour le ciblage)
var root:MovieClip = this;
//On defini l'url de base de notre swf
var adresse_swf:String = _url.substring(0, _url.split(".swf")[0].lastIndexOf("/")+1);
/********************************************************
 
  Chargement de la page html et traitement des données
 
*********************************************************/
//Url de la page distante à charger
var autre_url:String = "http://www.jeuxvideo.com/articles/0000/00000064_test.htm";
//On crée une nouvelle variable de chargement
var lorem_lv:LoadVars = new LoadVars();
//lorsque "lorem" est invoqué
this.lorem_lv.onData = function(src:String):Void  {
	if (src != undefined) {
		//si le fichier html est chargé alors...
		root.txt_html.htmlText = "Liste des liens: <br /><br />";
		//recuperation des liens
		root.lien = src.split("<a href=\"");
		//boucle sur le nombre de liens, on les insère dans notre champs de texte en les nettoyant
		for (var i:Number = 0; i<root.lien.length; i++) {
			//nettoyage
			root.lien[i] = root.lien[i].split("\"", 1)[0];
			//insertion
			root.txt_html.htmlText += "<a href='"+root.lien[i]+"'>"+root.lien[i]+"</a>";
		}
	} else {
		//et si le ficher html n'est pas trouvé
		root.txt_html.htmlText = "Impossible de charger le fichier";
	}
};
//Url a charger, en passant l'url distante en get
this.lorem_lv.load(root.adresse_swf+"secu_flash.php?maVariable="+root.autre_url);
Explications
J'ai repris l'exemple de mon billet precedent (loader une page html), sauf qu'on va extraire les infos d'une page distante.

Je recupère tous les liens se trouvant dans le code source de la page distante via la fonction split. Puis je les insère dans notre champs de texte.
Donc à vous de ruser pour retirer les infos dont vous avez besoin ;)
Download
Telecharger les fichiers d'exemple
load_external_file.zip

 ,  ,  ,  ,  ,  

Commentaires

1. Par Mr X

Juste un petit commentaire par rapport à ton include de fichier. En passant en GET comme ca le nom du fichier à appeler il est alors facile d'appeler un fichier php sur le serveur et ainsi de voir le contenu du fichier (accès serveur Mysql and co facilement récupérable ainsi par exemple)....
Donc attention :)

2. Par k-ny

Mème avec "file_get_contents" (différent d'un include !) ?

3. Par Pierre

Là ton script PHP présente une faille de sécurité potentiel.

Comme dit par Mr X je peut facilement lire les scripts présent sur ton serveur.

Pierre

4. Par Ares

Bonjour,

Ça fonctionne très bien sous IE 6 et plus mais avec Firefox 3.0, j'ai toujours une erreur de security sandbox? Est-ce que quelqu'un à une solution?
Merci.

Ajouter un commentaire

Mettez en forme votre commentaire : Voir les BBCodes disponibles



Fermer le Portfolio
You need to upgrade your Flash Player

Light Full Close