flex.scoutant.org


Keyword - crossdomain


2009/04/27

Hosting a PHP proxy and enabling Flash app to talk cross-domain

velov-proxy

FlashPlayer and cross-domain policy file

FlashPlayer offre une politique de sécurité rassurante : une application Flash chargée depuis un domaine A ne pourra consommer des services web depuis un autre domaine B.

Il est possible de configurer cette politique de sécurité. Considérons que le domaine cible B juge qu'il est opportun de servir les requêtes issue d'une appli Flash téléchargée depuis le domaine A. Alors il suffit que B expose, à la racine, un fichier crossdomain.xml qui alloue les droits correspondants.

Pour exemple, Delicious expose un fichier qui donne accès à toutes les appli Flash téléchargées depuis n'importe où : http://feeds.delicious.com/crossdomain.xml. Si vous suivez le lien, il faut éventuellement Afficher le code source.

<cross-domain-policy> 
  <allow-access-from domain="*" /> 
</cross-domain-policy>

C'est ce qui a permis de faire l'animation Flash d'un nuage de tags Delicious, DeliSphere, a Flash 3D-animation tagcloud for your Delicious bookmarks .

Google, Youtube, Fickr et d'autres exposent également une politique Flash-friendly : par exemple : http://api.flickr.com/crossdomain.xml .

Un Proxy !

Maintenant, si le provider de service n'est pas aussi accueillant pour les application Flash, on a la possibilité d'implanter un service de proxy qui prendra en charge de relayer les requêtes avec une autre technologie de client. On implante un tel service dans le même domaine qui sert l'application Flash : vis-à-vis de la VM FlashPlayer, on n'est plus dans une situation de cross-domain.

Proxy en Java avec BlazeDS

Adobe propose pour cela une solution toute prête. BlazeDS [1], la solution open-source de remoting AMF3, intègre un service de proxy.

Coté développement Flex, il suffit alors tout simplement de positionner sur les divers objets de communication la propriété useProxy en conséquence.

<mx:HTTPService url="" useProxy="true" />

BlazeDS est la meilleure solution que l'on retiendra dans tous les cas industriels. Techniquement, il s'agit d'une librairie Java, ce qui suppose donc un hébergeur en Java...

Proxy en PHP pour les hébergements restreint au PHP

Ce présent blog est hébergé chez OVH et comme c'est souvent le cas l'hébergeur propose du Php mais pas du Java. Une solution, consiste alors à écrire un service de proxy en PHP.

C'est ce qui est mis en oeuvre par le démonstrateur Velib en Flash

<mx:HTTPService id="phpProxiedService" 
  url="http://flex.scoutant.org/php/proxy.php" method="GET"
  resultFormat="e4x" useProxy="false" 
  result="doLoad(event)" fault="faultHandler(event)"/>
public function start( marker:StationMarker):void {
    phpProxiedService.request.url = this.url + marker.station.num;
    var token:AsyncToken = phpProxiedService.send();
    token.marker = marker;
 }

Ici l'objet de communication, le HTTPService, pointe vers le service de proxy, en l'occurrence : http://flex.scoutant.org/php/proxy.php. Ce service fait maison propose l'API simpliste suivante : la requête doit présenter un paramètre url indiquant l'url cible.

Voici ci-dessous le code du service proxy, avec utilisation d'un client curl, pour lequel on positionne l'url cible via le paramètre de requête $_REQUEST['url'].

<?php
$ch = curl_init();
$timeout = 30;
$userAgent = $_SERVER['HTTP_USER_AGENT'];
 
curl_setopt($ch, CURLOPT_URL, $_REQUEST['url']);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, $timeout);
curl_setopt($ch, CURLOPT_USERAGENT, $userAgent);
 
$response = curl_exec($ch);     
 
if (curl_errno($ch)) {
    echo curl_error($ch);
} else {
    curl_close($ch);
    echo $response;
}
?>

On pourra se référer au billet Using a PHP Proxy with Flex to talk Cross Domain , pour un peu plus de détails.

Proxy en BlazeDS sur hébergement GoogleAppEngine?

Le service d'hébergement GoogleAppEngine a été étendu à la technologie Java [2].

Du coup, on peut utiliser BlazeDS? Je n'ai pas fait le test, mais le billet suivant fait un constat négatif : GoogleAppEngine and BlazeDS  : la package java.lang.management n'est pas autorisé...

Notes

[1] Adobe open Source : BlazeDS

[2] Google App Engine : The new language on App Engine


2008/11/ 8

DeliSphere, a Flash 3D-animation tagcloud for your Delicious bookmarks

Visit the demo page to see the animated tagcloud for your delicious.com [1] account.

You can view the source and if you want to insert the DeliSphere tagcloud in your site, you can download the delisphere distribution.

The Delesphere tagcloud is an adaptation of the famous WordPress [2] Cumulus plugin.

The WordPress Cumulus plugin

WP-Cumulus [3] is a WordPress plugin providing a Flash 3D animation displaying the tags related to the WordPress-powered blog. You can visit Roy Tanck's site at http://www.roytanck.com.

If you are using DotClear-powered blog, you can use the TagFlash [4] adaptation.

WP-Cumulus is a WordPress plugin, hence a PHP script that will request the MySql database for tags hosted by the blog. A click on a tag will then open up the posts related to the tag.

Delisphere architecture - Delicious API

DeliSphere Flash animation uses Delicious web services to get the tag cloud. Consider for example the bookmarks for delicious account : http://delicious.com/coutant.

Delicious provides an API [5]. But to use those web services you need to be authenticated with targeted delicous account.

When you are just reeding public data like bookmarks or tags, the smartest approach is to use the feeds [6] services. Choosing RSS ot Json format. Json is just fine, for example the tag feed for above account is http://feeds.delicious.com/v2/json/tags/coutant .

{ "flex":135, "blazeds":7, "dnd": 8, "jee5":23 ... }
Delisphere architecture - cross-domain policy

FlashPlayer cross domain policy will not enable a Flash application downloaded from domain A to be requesting services from an another domain B. Unless domain B is actually exposing a cross-domain friendly policy file.

Delicious.com is not exposing such a friendly policy file. But since V2, the feeds service does! Here is the file : http://feeds.delicious.com/crossdomain.xml .

<cross-domain-policy>
  <allow-access-from domain="*" />
</cross-domain-policy>

See post crossdomain.xml now on feeds.delicious.com [7]

That way the delisphere app can be downloaded from anywhere onto a brower and from that location be connecting to Delicious feeds web service.

Last step is the randomizing of spherical coordinates [8]

Notes

[1] Social bookmarking delicious.com

[2] WordPress http://wordpress.org

[3] WP-Cumulus : a WordPress plugin to display your site's tags in a flash movie, http://wordpress.org/extend/plugins/wp-cumulus/

[4] tagflash, Dotclear plugin, an adaptation to Dotclear of WP-Cumulus http://plugins.dotaddict.org/dc2/details/tagflash

[5] Delicious API V2 : http://delicious.com/help/api

[6] Delicious data feeds http://delicious.com/help/feeds

[7] crossdomain.xml now onf feeds.delicious.com http://tech.groups.yahoo.com/group/ydn-delicious/message/1999 ,

[8] Distribution points on a sphere, in ActionScript3, randomizing sperical coordinates : http://blog.massivecube.com/?p=9


Using BlazeDS proxy service behind a firewall proxy

blazeds-proxy-400.png

FlashPlayer cross domain policy will not enable a Flash application downloaded from domain A to be requesting services from an another domain B. Unless domain B is actually exposing a cross-domain friendly policy file. For example Google does : http://www.google.com/crossdomain.xml.

In general, such a friendly crossdomain.xml file is not exposed by targeted service provider. In such case we can use BlazeDS proxy service.

We first need to configure the HTTPService to be using a proxy :

<mx:HTTPService useProxy="true" url=". ." />

Second, we need to install and launch BlazeDS. With trunkey BlazeDS[1] distribution it's straitforward. Obviously you need a Java-powered server : a sole Php-server will not help.

Consider you install the BlazeDS server in an intranet and a firewall has to be used to access the service provider B. You will need to configure BlazeDS so as to use the firewall proxy. If you just unzipped the turnkey distribution and launch BlazeDS, i guess you did not read corresponding 1000-page doc.

But it's just Java, you will try the general JVM-based approach, and you will be lauching BlazeDS with JMV args :

-DhttpProxyHost=<you-fire-wall> -DhttpProxyPort=3128

you will still fall in connection timeout. It's a pity. Even more when you know that BlazeDS is using Jakarta HttpClient support ; which actually honor above-mentionned configuration...

BlazeDS overrides that feature. The only way is to refer to documentation and to find out where firewall proxy can be configured. Not so easy, keyword proxy hardly allways refer to the proxy service...

Config file proxy-config.xml has to be customized :

<service id="proxy-service" class="flex.messaging.services.HTTPProxyService">
   <properties>
        . . .
        <allow-lax-ssl>true</allow-lax-ssl>
        <external-proxy>
                <server>your-firewall</server>
                <port>3128</port>
        </external-proxy>