Forums Développement Multimédia

Les formations Mediabox
Les formations Mediabox



charger un fichier distant

Compatible ActionScript 2. Cliquer pour en savoir plus sur les compatibilités.Compatible PHP. Cliquer pour en savoir plus sur les compatibilités.

Article écrit le 05/04/2007 18:56.
Par k-ny ( Blog ).




Lorsque l'on commence à faire un peu de flash dynamique, et que l'on comprend tout le potentiel de charger des fichiers externes (XML, 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 limitation.



A noter que cette technique est à utiliser seulement si vous n'avez pas accès (FTP) au serveur sur lequel se trouve les fichiers a charger dans votre swf.
Car si vous y avez accès, je preconise la methode ”crossdomain.xml”, qui evitera donc d'utiliser des ressources supplementaires inutilement.



Au programme

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 selon moi 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 à leurs fichiers 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 swf 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

    <?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"]);
    ?>

Enregistrez ce script dans un fichier ”secu_flash.php”. Si possible enregistrez-le en utf-8 (bloc-notes, enregistrez sous …), si pas decommenter le 1er echo et supprimer le 2ème echo.


  • file_get_contents est une fonction qui va chercher le contenu du fichier passer en paramètre.
  • $_GET["maVariable"] correspond a la variable d'url que l'on va envoyer depuis flash.

Exemples

Exemple rapide

Pour un xml distant, dans le .load vous auriez ecrit:

this.reviews_xml.load("http://labas.com/fichier.xml");

Avec ma technique vous ecrirez:

this.reviews_xml.load("secu_flash.php?maVariable=http://labas.com/fichier.xml");
Exemple de recuperation d'un flux rss 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.webinventif.fr/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);

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.

J'ai commenté au maximum le code source. Evidement il pourrait-ètre different d'un flux à l'autre, c'est juste pour l'exemple

Exemple de recuperation et parsage de certaines données d'une page html
/********************************************************
  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);

J'ai repris l'exemple d'un billet sur mon blog (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 ;)

J'ai commenté au maximum le code source.

Download

En savoir plus