HTML dans AIR

AIR ajoute de nouveaux attributs aux éléments image et iframe de contenu dans le sandbox de l’application :

Attribut sandboxRoot

L’attribut sandboxRoot spécifie un domaine de remplacement autre que d’application d’origine pour le fichier indiqué par l’attribut src du cadre. Le fichier est chargé dans le sandbox autre que d’application correspondant au domaine précisé. Le contenu du fichier et celui chargé à partir du domaine indiqué peuvent être intercodés.

Important : si vous définissez la valeur de sandboxRoot sur l’URL de base du domaine, toutes les requêtes de contenu provenant de ce domaine sont chargées depuis le répertoire de l’application au lieu du serveur distant (qu’elles résultent d’une opération de navigation dans les pages, d’une requête XMLHttpRequest ou d’une autre méthode de chargement de contenu).

Attribut documentRoot

L’attribut documentRoot indique le répertoire local à partir duquel sont chargées les URL renvoyant à des fichiers situés à l’emplacement spécifié par sandboxRoot .

Lors de la résolution des URL, soit dans l’attribut src du cadre soit dans le contenu chargé dans le cadre, la partie de l’URL correspondant à la valeur précisée dans sandboxRoot est remplacée par celle définie dans documentRoot . Par conséquent, dans la balise de cadre suivante :

<iframe        src="http://www.example.com/air/child.html"  
            documentRoot="app:/sandbox/" 
            sandboxRoot="http://www.example.com/air/"/>

child.html est chargé depuis le sous-répertoire sandbox du dossier d’installation de l’application. Les URL relatives contenues dans child.html sont résolues en fonction du répertoire sandbox . Vous noterez que les fichiers situés sur le serveur distant à l’adresse www.example.com/air ne sont pas accessibles dans le cadre, car AIR tenterait sinon de les charger à partir du répertoire app:/sandbox/.

Attribut allowCrossDomainXHR

Incluez allowCrossDomainXHR="allowCrossDomainXHR" dans la balise de cadre d’ouverture afin de permettre au contenu du cadre d’émettre des requêtes XMLHttpRequest en direction de tout domaine distant. Par défaut, un contenu autre que d’application peut uniquement effectuer de telles requêtes en direction de son propre domaine d’origine. La possibilité d’effectuer des XHR interdomaines entraîne des risques importants au niveau de la sécurité. Le code de la page permet en effet d’échanger des données avec n’importe quel domaine. Si un contenu malveillant est introduit dans la page d’une manière quelconque, toutes les données accessibles au code dans le sandbox actif sont en danger. C’est pourquoi il est recommandé d’activer uniquement les requêtes XHR interdomaines pour les pages que vous créez et contrôlez, et à condition que le chargement de données interdomaines soit réellement nécessaire. En outre, validez avec précaution toutes les données externes chargées par la page afin d’empêcher l’introduction de code ou d’autres formes d’attaques.

Important : si l’attribut allowCrossDomainXHR se trouve dans un élément image ou iframe, les requêtes XHR interdomaines sont activées (à moins que la valeur attribuée soit égale à 0 ou commence par les lettres f ou n). Par exemple, définir allowCrossDomainXHR sur la valeur deny maintient l’activation des requêtes XHR interdomaines. Excluez totalement l’attribut de la déclaration d’élément si vous préférez ne pas activer les requêtes interdomaines.

ondominitialize, attribut

Indique un gestionnaire d’événement pour l’événement dominitialize d’un cadre. Cet événement, spécifique à AIR, est déclenché une fois que les objets window et document du cadre ont été créés, mais avant l’analyse des scripts ou la création d’éléments de document.

Le cadre distribue l’événement dominitialize suffisamment tôt dans la séquence de chargement pour qu’un script de la page enfant puisse référencer les objets, variables et fonctions ajoutés au document enfant par le gestionnaire dominitialize . La page parent doit se trouver dans le même sandbox que l’enfant pour pouvoir insérer ou ouvrir directement tout objet figurant dans un document enfant. Toutefois, un parent situé dans le sandbox de l’application peut établir un pont de sandbox afin de communiquer avec le contenu d’un sandbox autre que d’application.

Les exemples suivants illustrent l’utilisation de la balise iframe dans AIR :

Placez child.html dans un sandbox distant, sans définir de mappage à un domaine réel situé sur un serveur distant :

<iframe        src="http://localhost/air/child.html"  
            documentRoot="app:/sandbox/" 
            sandboxRoot="http://localhost/air/"/>

Placez child.html dans un sandbox distant, en autorisant uniquement les requêtes XMLHttpRequest émises en direction de www.example.com :

<iframe        src="http://www.example.com/air/child.html"  
            documentRoot="app:/sandbox/" 
            sandboxRoot="http://www.example.com/air/"/>

Placez child.html dans un sandbox distant, en autorisant les requêtes XMLHttpRequest émises en direction de n’importe quel domaine distant :

<iframe        src="http://www.example.com/air/child.html"  
            documentRoot="app:/sandbox/" 
            sandboxRoot="http://www.example.com/air/" 
            allowCrossDomainXHR="allowCrossDomainXHR"/>

Placez child.html dans un sandbox local avec système de fichiers :

<iframe             src="file:///templates/child.html"  
            documentRoot="app:/sandbox/" 
            sandboxRoot="app-storage:/templates/"/>

Placez child.html dans un sandbox distant en vous servant de l’événement dominitialize pour établir un pont de sandbox :

<html> 
<head> 
<script> 
var bridgeInterface = {}; 
bridgeInterface.testProperty = "Bridge engaged"; 
function engageBridge(){ 
    document.getElementById("sandbox").parentSandboxBridge = bridgeInterface; 
} 
</script> 
</head> 
<body> 
<iframe id="sandbox" 
            src="http://www.example.com/air/child.html"  
            documentRoot="app:/" 
            sandboxRoot="http://www.example.com/air/" 
            ondominitialize="engageBridge()"/> 
</body> 
</html>

Le document child.html suivant montre comment un contenu enfant peut accéder au pont de sandbox parent :

<html> 
    <head> 
        <script> 
            document.write(window.parentSandboxBridge.testProperty); 
        </script>   
    </head>   
    <body></body> 
</html>

Pour plus d’informations, voir Programmation croisée du contenu dans des sandbox de sécurité distincts et Sécurité HTML dans Adobe AIR .

Dans AIR et Webkit, les objets DOM distribuent certains événements introuvables dans le modèle d’événement DOM standard. Le tableau suivant dresse la liste des attributs d’événement associés que vous pouvez utiliser afin de spécifier des gestionnaires pour ces événements :

Vous pouvez ajouter l’attribut contentEditable à tout élément HTML permettant aux utilisateurs de modifier le contenu de l’élément. Par exemple, dans l’exemple suivant, le code HTML définit la totalité du document comme étant modifiable, à l’exception du premier élément p :

<html> 
<head/> 
<body contentEditable="true"> 
    <h1>de Finibus Bonorum et Malorum</h1> 
    <p contentEditable="false">Sed ut perspiciatis unde omnis iste natus error.</p> 
    <p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis.</p> 
</body> 
</html>

AIR prend en charge les URL de type data: pour les éléments suivants :

• img

• input type=”image”

• Règles CSS qui autorisent les images (telles les images d’arrière-plan)

Les URL de type data: permettent d’insérer directement des données d’images binaires dans un document CSS ou HTML sous forme de chaîne codée au format base64. L’exemple suivant utilise une URL de type data: sous forme d’arrière-plan répété :

<html> 
<head> 
<style> 
body { 
background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAMAAABHPGVmAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRF%2F6cA%2F%2F%2F%2Fgxp3lwAAAAJ0Uk5T%2FwDltzBKAAABF0lEQVR42uzZQQ7CMAxE0e%2F7X5oNCyRocWzPiJbMBZ6qpIljE%2BnwklgKG7kwUjc2IkIaxkY0CPdEsCCasws6ShXBgmBBmEagpXQQLAgWBAuSY2gaKaWPYEGwIEwg0FRmECwIFoQeQjJlhJWUEFazjFDJCkI5WYRWMgjtfEGYyQnCXD4jTCdm1zmngFpBFznwVNi5RPSbwbWnpYr%2BBHi%2FtCTfgPLEPL7jBctAKBRptXJ8M%2BprIuZKu%2BUKcg4YK1PLz7kx4bSqHyPaT4d%2B28OCJJiRBo4FCQsSA0bziT3XubMgYUG6fc5fatmGBQkL0hoJ1IaZMiQsSFiQ8vRscTjlQOI2iHZwtpHuf%2BJAYiOiJSkj8Z%2FIQ4ABANvXGLd3%2BZMrAAAAAElFTkSuQmCC'); 
background-repeat:repeat; 
} 
</style> 
</head> 
<body> 
</body> 
</html>

Lorsque vous utilisez des URL de type data:, n’oubliez pas que les espaces blancs ont une signification particulière. Vous devez par exemple entrer la chaîne de données sous forme de ligne continue. Les sauts de ligne sont sinon assimilés aux données et il est impossible de décoder l’image.