HTML i AIR

Adobe AIR 1.0 och senare

AIR och WebKit definierar några HTML-element och -attribut som inte är standard, bland annat:

Bildrute- och iframe-element i HTML

Händelsehanterare för HTML-element

Bildrute- och iframe-element i HTML

AIR tillför nya attribut till bildrute- och iframe-elementen i innehållet i sandlådan application:

Attributet sandboxRoot
Attributet sandboxRoot anger en alternativ, icke-programrelaterad domän för ursprunget till filen som anges med bildruteattributet src. Filen läses in i den icke-programrelaterade sandlåda som motsvarar angiven domän. Innehållet i filen och innehållet som läses in från angiven domän kan korsskripta varandra.
Viktigt! Om du ställer in värdet för sandboxRoot till domänens bas-URL, läses alla förfrågningar om innehåll från den domänen in från programkatalogen i stället för fjärrservern (oavsett om förfrågningen resulterar från sidnavigering, från en XMLHttpRequest eller från någon annan metod för att läsa in innehåll).

Attributet documentRoot
Attributet documentRoot anger den lokala katalogen från vilken det ska läsas in URL:er som löses till filer på den plats som anges av sandboxRoot.

När URL:er löses, antingen i bildruteattributet src eller i innehåll som läses in till bildrutan, byts den del av URL:en som matchar värdet som anges i sandboxRoot ut mot värdet som anges i documentRoot. I följande bildrutetagg sker därför följande:

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

child.html läses in från underkatalogen sandbox i programmets installationsmapp. Relativa URL:er i child.html löses utifrån katalogen sandbox. Observera att alla filer på fjärrservern på www.example.com/air inte är tillgängliga i bildrutan, eftersom AIR försöker att läsa in dem från katalogen app:/sandbox/.

Attributet allowCrossDomainXHR
Ta med allowCrossDomainXHR="allowCrossDomainXHR" i den inledande bildrutetaggen om du vill tillåta att innehåll i bildrutan skickar XMLHttpRequests till en fjärrdomän. Innehåll som inte är programinnehåll kan som standard bara göra sådana förfrågningar till sin egen ursprungsdomän. Om du tillåter XHR:er mellan domäner kan det få allvarliga konsekvenser för säkerheten. Koden på sidan kan utbyta data med alla domäner. Om skadligt innehåll injiceras på sidan kan alla data som är tillgängliga för koden i den aktuella sandlådan påverkas. Du ska bara aktivera XHR:er mellan domäner för sidor som du skapar och kontrollerar och bara när datainläsning mellan domäner verkligen behövs. Du ska också noggrant kontrollera alla externa data som läses in av sidan för att förhindra kodinjiceringar eller andra former av attacker.
Viktigt! Om attributet allowCrossDomainXHR ingår i ett bildrute- eller iframe-element aktiveras XHR:er mellan domäner (såvida inte värdet tilldelas ”0” eller börjar med bokstaven ”f” eller ”n”). Om du till exempel ställer in allowCrossDomainXHR på ”deny" aktiveras ändå XHR:er mellan domäner. Ta inte med attributet över huvud taget i elementdeklarationen om du inte vill aktivera förfrågningar mellan domäner.

Attributet ondominitialize
Anger en händelsehanterare för händelsen dominitialize för en bildruta. Den här händelsen är en AIR-specifik händelse som utlöses när fönster- och dokumentobjekten för bildrutan har skapats, men innan några skript har analyserats eller dokumentelement har skapats.

Bildrutan skickar händelsen dominitialize tillräckligt tidigt i läsningssekvensen så att alla skript på den underordnade sidan kan referera till objekt, variabler och funktioner som har lagts till i det underordnade dokumentet av dominitialize-hanteraren. Den överordnade sidan måste finnas i samma sandlåda som den underordnade för att det ska gå att lägga till eller komma åt objekt direkt i ett underordnat dokument. En överordnad i sandlådan application kan emellertid skapa en sandlådebrygga för att kommunicera med innehåll i andra sandlådor än sandlådan application.

I följande exempel visas hur iframe-taggen används i AIR:

Placera child.html i en fjärrsandlåda, utan att mappa till en faktisk domän på en fjärrserver:

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

Placera child.html i en fjärrsandlåda, och tillåt bara XMLHttpRequests till www.example.com:

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

Placera child.html i en fjärrsandlåda, och tillåt bara XMLHttpRequests till valfri fjärrdomän:

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

Placera child.html i en lokal sandlåda i filsystemet:

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

Placera child.html i en fjärrsandlåda, där händelsen dominitialize används för att skapa en sandlådebrygga:

<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>

Följande child.html-dokument visar hur underordnat innehåll får åtkomst till den överordnade sandlådebryggan:

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

Mer information finns i Korsskriptning av innehåll i olika säkerhetssandlådor och HTML-säkerhet i Adobe AIR.

Händelsehanterare för HTML-element

DOM-objekt i AIR och WebKit skickar vissa händelser, som inte finns i den vanliga DOM-händelsemodellen. I tabellen nedan anges vilka närliggande händelseattribut som du kan använda för att ange hanterare för dessa händelser:

Namn på återanropsattribut

Beskrivning

oncontextmenu

Anropas när en snabbmeny anropas, till exempel via ett högerklick eller kommando-klick på markerad text.

oncopy

Anropas när en markering i ett element kopieras.

oncut

Anropas när en markering i ett element klipps ut.

ondominitialize

Anropas när DOM för ett dokument som har lästs in i en bildruta eller iframe skapas, men innan några DOM-element skapas eller skript analyseras.

ondrag

Anropas när ett element dras.

ondragend

Anropas när någon slutar att dra.

ondragenter

Anropas när någon drar innanför gränsen till ett element.

ondragleave

Anropas när någon drar utanför gränsen till ett element.

ondragover

Anropas fortlöpande när någon drar inom gränserna till ett element.

ondragstart

Anropas när en dragning inleds.

ondrop

Anropas när en dragning släpps över ett element.

onerror

Anropas när ett fel inträffar medan ett element läses in.

oninput

Anropas när text skrivs i ett formulärelementet.

onpaste

Anropas när ett objekt klistras in i ett element.

onscroll

Anropas när innehållet i ett rullningsbart element rullas.

onselectstart

Anropas när en markering börjar.

HTML-attributet contentEditable

Du kan lägga till attributet contentEditable till valfritt HTML-element så att användarna kan redigera innehållet i elementet. I följande exempel på HTML-kod ställs hela dokumentet in på att vara redigerbart, förutom det första p-elementet:

<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>
Obs! Om du ställer in egenskapen document.designModeon kan alla element i dokumentet redigeras, oavsett inställningen av contentEditable för ett enskilt element. Om du ställer in designModeoff inaktiveras emellertid inte redigering av element där contentEditable är true. Mer information finns i Egenskapen Document.designMode.

Data: URL

AIR stöder konstruktionen data: URL för följande element:

  • img

  • indatatyp=”bild”

  • CSS-regler som tillåter bilder (till exempel bakgrundsbilder)

Med hjälp av data-URL:er kan du infoga binära bilddata direkt i ett CSS- eller HTML-dokument som en base64-kodad sträng. I följande exempel används data: URL som en repeterande bakgrund:

<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>

Tänk på att det är viktigt att lämna plats för extra utrymme när du använder data: URL. Datasträngen måste till exempel anges på en enda obruten rad. Annars behandlas radbrytningarna som del av data och bilden kan inte avkodas.