IFrame
L’acteur Iframe permet d’intégrer une page web dans votre scène.
Sommaire
🔧 propriété · ℹ️ information · ⚙️ méthode · ⚡ évènement · 🔒 lecture seule
Propriétés
Autoriser le chargement de contenu
Autoriser le chargement du contenu du contexte de navigation supérieur
Autoriser les formulaires
this.properties.allowForms · boolean · défaut true
Autoriser les formulaires
Cette propriété permet d’activer / désactiver les formulaires lors de la navigation dans la Synapp.
Si l’on désactive cette option, il ne sera plus possible d’utiliser les formulaires de connexion, les formulaires de contact, etc …
Autoriser les modales
this.properties.allowModals · boolean · défaut true
Autoriser les modales
Cette propriété permet d’activer / désactiver toute les alertes systèmes qui pourraient survenir à la suite d’une action dans l’iFrame.
Autoriser les popups
this.properties.allowPopups · boolean · défaut true
Autoriser les popups
Cette propriété permet d’activer / désactiver les popups lors de la navigation dans le site web de l’iFrame.
Cela peut avoir pour effet de désactiver certains formulaires de connexion.
Autoriser les scripts
this.properties.allowScripts · boolean · défaut true
Autoriser les scripts
Cette propriété permet d’activer ou de désactiver le JavaScript du site web chargé par l’iFrame.
Autoriser les téléchargements
this.properties.allowDownloads · boolean · défaut true
Autoriser les téléchargements
Traiter comme même origine
this.properties.allowSameOrigin · boolean · défaut true
Traiter comme même origine
Cette propriété permet de d’autoriser que le site web affiché de même origine soit considéré de la sorte.
Si cette propriété est désactivée, les ressources du site d’origine seront donc inaccessible pour l’iFrame alors même qu’il est vraiment sur la même origine. De plus, le site à l’intérieur de l’iFrame aura une origine ‘null’ ce qui peut empêcher certaines requêtes et limiter certains accès.
Pour en apprendre plus sur les origines et leurs fonctionnements : La documentation MDN peut être trouvée à cette adresse.
URL
this.properties.url · string · défaut '' · {{jokerable}} · modifie : Style CSS
URL de la page WEB à afficher. Peut être complété par des jokers.
Cette propriété permet de renseigner une URL d’un élément à afficher dans l’acteur.
Cet élément doit être une adresse qui référence une ressource WEB ou plus fréquemment une page WEB de n’importe quel site WEB accessible.
Il faut noter que certains sites WEB interdisent l’accès au travers d’une iFrame.
Jokerable
Il est possible de placer des jokers (ex.: {{jokerKey}}) dans la définition de l’URL qui seront remplacés par la valeur d’additionnelles de même clé.
Par exemple :
https://www.wit.fr/{{section}}/
Une additionnelle de clé section de type texte remplacera le joker par sa valeur.
Informations
Accessibles par script, via this dans un script de l’acteur ou context.getActor('clé') depuis un autre acteur.
Contenu complété
this.completedContent · 🔒 lecture seule · String
Le texte une fois complété.
Le champs d’information contenu complété est le texte résultant une fois les jokers remplacés par les valeurs des additionnelles.
Hérite de
Outre ce qui est décrit ici, l’acteur a tout ce que décrit l’acteur de base : propriétés communes (taille, disposition, aspect, texte, bordures, effets…), évènements communs (cycle de vie, souris, clavier…) et membres accessibles par script.
Il hérite aussi de :
- JokerableContent (comportement) : Étend la classe pour permettre d’ajouter des jokers sur un contenu. Par défaut sur
properties.content. Le valeur d’un joker est obtenue sur l’additionnelle de même clé.
Quelques exemples
iframe vers REDY
Voici un exemple d’iFrame qui montre une page du REDY.
L’additionnelle Chemin REDY permet de définir le chemin vers la page, depuis la racine du REDY (ici, on affiche le tableau de bord).
SYNAPPS-STUDIO-ACTOR|{"type":"display/iframe","key":"iframe1","properties":{"verticalAlignment":"expand"},"additionalDefs":{"redyPath":{"type":"text","label":"Chemin REDY"}},"additionals":{"redyPath":"/easy/dashboard"},"bindings":{"properties.url":{"sourceType":"relative","sourcePath":"self","path":"additionals.redyPath"}},"events":{"properties/url/binding/onReadTransform":["return `${this.dataStores.redy.host.domain}/WSID${this.dataStores.redy.host.session.sid}${context.value}`;"]}}
