Sujets sur : navigateur precedent

Cours ActionScript 3 ‘navigateur precedent’

Utiliser l’historique du navigateur dans Flash avec les boutons précédent / suivant

18 questions

Ecrit le 13 décembre par Matthieu
Publié dans le(s) sujet(s) Adobe Flash

Nous allons apprendre comment utiliser les boutons suivant / précédents de votre navigateur (Firefox, Internet Explorer…) dans vos applications Flash.

Le script SwfAddress gère l’utilisation des boutons suivant / précédent de votre navigateur (Firefox) avec votre application Flash.

Il permet également d’accéder directement à une page de votre application avec une url. C’est très pratique pour donner le lien direct d’une page (ou interface) de votre site flash.

Les fonctionnalités de SWFAddress

SWFAddress est librairie Open Source sous forme de plugin à SWFObject.

SWFAddress offre les possibilités suivantes :

  • Les boutons suivant, précédant et rafraichir du navigateur sont pris en compte par votre application flash.
  • Un meilleur référencement de votre site flash avec une prise en compte SEO des moteurs de recherche.
  • Vous avez un accès direct aux différentes interfaces de votre site flash, avec une url du type
  • Vous pouvez également modifier le titre de la page du navigateur directement à partir de votre application flash. Cela permet d’optimiser le référencement.

Utilisation de SWFAddress

Pour utiliser SWFAddress, votre contenu Flash doit être ajouter dans votre page web (html ou php) avec le script SWFObject. Pour cela, consultez le tutoriel : Afficher du Flash avec SWFObject.

Ensuite, téléchargez la dernière version du script SWFAddress depuis le site de l’Auteur (Download SWFAddress 2.4).

Détails des fonctions possibles

SWFAddress.getValue()

Cette méthode renvoie le paramètre situé dans la barre d’adresse du navigateur de votre internaute. Ce paramètre correspond au contenu placé après le symbole #

Avec votre code ActionScript, SWFAddress.getValue() renvoie la dernière valeur donnée par SWFAddress.setValue(param:String).

SWFAddress.setValue(param:String)

Cette méthode met à jour l’url de votre navigateur. Elle conserve également une reférence dans votre application Flash qui peut ètre récupérée avec SWFAddress.getValue().

SWFAddress.setTitle(param:String)

Cette méthode permet de mettre à jour le titre de la page actuelle du navigateur de votre internaute.

SWFAddress.getTitle() permet de récupérer le titre de la page actuelle, à tout moment dans votre application Flash.

SWFAddress.setStatus(param:String)

Cette méthode modifie le texte qui apparait dans la barre de statut du navigateur de votre internaute.

SWFAddress.resetStatus() efface le texte de la barre de statut du navigateur.

SWFAddress.addEventListener(SWFAddressEvent.CHANGE, handleSWFAddress)

En ActionScript 3, SWFAddress permet d’écouter les évènements diffusés à chaque changement page. C’est à dire, à chaque fois que votre application Flash change de page ou appelle SWFAddress.setValue(param:String), l’évènement SWFAddressEvent.CHANGE est diffusé.

Améliorer son référencement avec SWFAddress

En utilisant les fonctionnalités de SWFAddress, vous pouvez paramétrer l’adresse, le titre et l’historique du navigateur à chaque changement de page. Ainsi, votre application Flash affiche le nom de la page courante où se situe l’utilisateur.

De plus, il est possible d’accéder directement à une page du site Flash via son URL statique. En tapant par exemple , l’utilisateur est redirigé directement sur la page « interface1 » du site. Cette méthode est très pratique pour mettre une page du site Flash directement dans les Favoris.

En utilisant cette méthode pour créer un fichier sitemap.xml (lisez cet article sur le référencement d’un site Flash),vous pouvez ajouter toutes les urls menant aux différentes interfaces de votre site Flash.

Vous améliorez significativement le référencement de votre site Flash, puisque toutes les adresses (interfaces) sont disponibles dans l’index des moteurs de recherches et renverront directement sur la page concernée avec son nom affiché dans la barre d’adresse.

Exemple AS3 avec SWFAddress

Vous avez téléchargé le fichier zip SWFAddress contenant l’ensemble du code source, des exemples et de la documentation. Dans mon tutoriel, je reprends l’exemple SEO pour vous montrer les améliorations possibles du référencement de vos Applications Flash.

Création du fichier .htaccess

A l’aide de votre client FTP (FileZilla par exemple), modifiez le fichier .htaccess à la racine de votre site.

Renseignez les informations suivantes :

  • le répertoire de base contenant le fichier qui lance votre application flash. En règle général, c’est / ou /site.
  • le nom du fichier qui lance votre application Flash. Dans la majorité des cas, c’est le fichier index.php.

[codesyntax lang= »apache » title= »htaccess » bookmarkname= »htaccess »]

[/codesyntax]

Création du fichier datasource.php

Ce fichier contient la version HTML de votre site Flash. Si un internaute ne possède pas le plugin flash installé sur son navigateur web, une version HTML de votre site Flash est alors affichée.

Renseignez dans les case : tous les noms des pages de votre site Flash. Ce sont les mêmes noms utilisés dans votre code ActionScript 3.

[codesyntax lang= »php » title= »datasource.php » bookmarkname= »datasource.php »]

[/codesyntax]

Création du fichier index.php

Dans mon exemple, j’ai appelé ce fichier swfaddress_exemple.php.

Il vous suffit de copier-coller l’ensemble du code php ci-dessous dans votre fichier.

[codesyntax lang= »php » title= »index.php » bookmarkname= »index.php »]

[/codesyntax]

A la suite de code, vous appelez les 3 fichiers javascript, avec une fonction php, pour configurer le fonctionnement de votre application flash.

Pensez à modifier les chemins d’accès javascript en fonction de leur emplacement sur votre serveur web (/js/ dans mon exemple).

[codesyntax lang= »php » title= »swfaddress » bookmarkname= »swfaddress »]

[/codesyntax]

Ensuite, il vous reste à afficher votre application flash avec SWFObject.

[codesyntax lang= »php » title= »SWFObject » bookmarkname= »SWFObject »]

[/codesyntax]

Création du code source AS3

Une fois l’initialisation de votre application effectuée, vous ajoutez un écouteur sur les évènements diffusés par SWFAddress.

Cela permet à votre application Flash de se mettre à jour automatiquement en fonction des évènements reçus par SWFAddress (en javascript ou flash).

Dans notre exemple, la fonction handleSWFAddress sera appelée à chaque évènement reçu.

[codesyntax lang= »actionscript3″ title= »SWFAddress.as » bookmarkname= »SWFAddress.as »]

[/codesyntax]

C’est la fonction handleSWFAddrress qui, en fonction du paramètre reçu dans e.value, affiche l’interface choisi par votre internaute.

[codesyntax lang= »actionscript3″ title= »SWFAddress.as » bookmarkname= »SWFAddress.as »]

[/codesyntax]

Récupération des paramètres de l’url

Avec SWFAddress, il est possible de récupérer les variables transmises dans l’url du navigateur. Cela est très pratique pour transmettre des valeurs à votre application Flash.

J’ai ajouté un exemple de code AS3 dans la fonction handleSWFAddress qui écoute tous les évènements.

[codesyntax lang= »actionscript3″ title= »paramètres de l’url » bookmarkname= »paramètres de l’url »]

[/codesyntax]

Téléchargement code source AS3 de SWFAddress

Vous trouverez ci-dessous un exemple complet avec SWFAddress et le Framework de Composants AS3 Facile.

Télécharger “SWFAddress Exemple”

swfaddress_framework_actionscript-facile.zip – Téléchargé 713 fois – 93,74 Ko

Testez l’Application Flash de notre tutoriel.

Naviguez et regardez la barre d’adresse, de statut et le titre de la page.

Essayer les boutons précédent / suivant de votre navigateur.

Cliquez sur une des url ci-dessous pour afficher directement une interface précise :

  • Interface Démonstration 3
  • Interface Éditeur AS3

Code source AS3 commenté de notre exemple avec SWFAddress

  • SWFAddressExample.as

[codesyntax lang= »actionscript3″ title= »SWFAddressExample.as » bookmarkname= »SWFAddressExample.as »]

[/codesyntax]

Montrez moi vos applications flash utilisant SWFAddress

Ou peut être utilisez-vous une autre technique plus simple ?

Partagez votre technique dans les commentaires ci-dessous.