mathefritz: sandbox="allow-scripts" wirkt invers

laut Artikel zu iframe sollte Attribut sandbox="allow-scripts" eigentlich bewirken was es sagt, aber in folgenden Codes kommt gerufener.htm nicht zu Wort.
Seletsam ist auch, daß, um das 'B' aus "rufer.htm" direkt unter das "A" zu bringen, NACH dem 'B' ein <br> erforderlich ist

Datei rufer.htm:

<!DOCTYPE html>
<html><head></head>
<body>
A<br> 
E
   <iframe src="gerufener.htm"
     sandbox="allow-scripts">
  </iframe>
   <iframe src="gerufener2.htm">
  </iframe>
     <script>function aGg(x){alert(x+"seltsam");}</script >
</body>
</html>

Datei gerufener:

<!DOCTYPE html>
<html><head></head>
<body> <script> parent.aGg("sehr1");</script>
  iiiii
</body>
</html>

Datei gerufener2.htm

<!DOCTYPE html>
<html><head></head>
<body> <script> parent.aGg("sehr2");</script>
AhAhA
</body>
</html>
  1. Hallo mathefritz,

    Seletsam ist auch, daß, um das 'B' aus "rufer.htm" direkt unter das "A" zu bringen, NACH dem 'B' ein <br> erforderlich ist

    Datei rufer.htm:

    <body>
    A<br> 
    E
    </body>
    

    Du meinst „E“? Nee, nicht seltsam. Der default-Wert von white-space ist normal.

    Bis demnächst
    Matthias

    --
    Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
    1. Danke Matthias

      Hallo mathefritz,

      Seletsam ist auch, daß, um das 'B' aus "rufer.htm" direkt unter das "A" zu bringen, NACH dem 'B' ein <br> erforderlich ist

      Datei rufer.htm:

      <body>
      A<br> 
      E
      </body>
      

      Du meinst „E“? Nee, nicht seltsam. Der default-Wert von white-space ist normal.

      ja, meine ich - iframe ist also inline;

      und was zu allow-scripts ?

      1. Hallo mathefritz,

        ja, meine ich - iframe ist also inline;

        Dein A und E hat lt. Quelltext nichts mit den Iframes zu tun.

        und was zu allow-scripts ?

        Dazu kann ich nichts sagen.

        Bis demnächst
        Matthias

        --
        Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
        1. Hallo mathefritz,

          ja, meine ich - iframe ist also inline;

          Dein A und E hat lt. Quelltext nichts mit den Iframes zu tun.

          schon klar, aber der 1te iframe wird eben "inline" nach dem 'E',
          mit der unteren Umrandungslinie auf höhe der Text-Grundlinie dargestellt.
          Das mit style="vertical-align:..." zu ändern scheint nicht möglich zu sein.
          <br> ist da wohl wirklich das Einfachste.

          1. Hallo mathefritz,

            ja, meine ich - iframe ist also inline;

            Ja.

            Dein A und E hat lt. Quelltext nichts mit den Iframes zu tun. schon klar, aber der 1te iframe wird eben "inline" nach dem 'E',
            mit der unteren Umrandungslinie auf höhe der Text-Grundlinie dargestellt.
            Das mit style="vertical-align:..." zu ändern scheint nicht möglich zu sein.

            Ich weiß ja nicht, was du erreichen möchtest, aber

            iframe {
                vertical-align: middle /* oder top oder bottom */;
            }
            

            tut, was es soll.

            Bis demnächst
            Matthias

            --
            Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
      2. Hallo,

        und was zu allow-scripts ?

        ich weiß es auch nicht, aber nach Lesen der Doku habe ich die Vermutung, dass mit sandbox der iFrame abgeschottet wird, und mit sandbox="allow-scripts" werden Scripte innerhalb der Box erlaubt, aber keine Zugriffe aus der Box heraus.

        Gruß
        Jürgen

  2. Hi,

    Seletsam ist auch, daß, um das 'B' aus "rufer.htm" direkt unter das "A" zu bringen, NACH dem 'B' ein <br> erforderlich ist

    404 B not found ...

    laut Artikel zu iframe sollte Attribut sandbox="allow-scripts" eigentlich bewirken was es sagt, aber in folgenden Codes kommt gerufener.htm nicht zu Wort.

       <iframe src="gerufener.htm"
         sandbox="allow-scripts">
      </iframe>
       <iframe src="gerufener2.htm">
      </iframe>
         <script>function aGg(x){alert(x+"seltsam");}</script >
    

    Kann es sein, daß die Seite im 1. iframe bereits geladen ist, bevor in der äußeren Seite das Script die Funktion definiert?

    Was sagt die Error-Console des Browsers?

    Und ändert sich das Verhalten, wenn Du das Script-Element mit der Funktions-Definition vor den iframes notierst?

    cu,
    Andreas a/k/a MudGuard

    1. Danke MudGuard

      Hi,

      Seletsam ist auch, daß, um das 'B' aus "rufer.htm" direkt unter das "A" zu bringen, NACH dem 'B' ein <br> erforderlich ist

      404 B not found ...

      jaja, schon gut :)

      laut Artikel zu iframe sollte Attribut sandbox="allow-scripts" eigentlich bewirken was es sagt, aber in folgenden Codes kommt gerufener.htm nicht zu Wort.

         <iframe src="gerufener.htm"
           sandbox="allow-scripts">
        </iframe>
         <iframe src="gerufener2.htm">
        </iframe>
           <script>function aGg(x){alert(x+"seltsam");}</script >
      

      Kann es sein, daß die Seite im 1. iframe bereits geladen ist, bevor in der äußeren Seite das Script die Funktion definiert?

      wie feststellen ?

      Was sagt die Error-Console des Browsers?

      Error: Permission denied to access property "aGg"

      <body> <script> parent.aGg("sehr1");</script>

      Und ändert sich das Verhalten, wenn Du das Script-Element mit der Funktions-Definition vor den iframes notierst?

      nein, obige Fehlermeldung bekommen ich wenn das Scriptelement vor den iframes steht

  3. Hallo mathefritz,

    laut Artikel zu iframe sollte Attribut sandbox="allow-scripts" eigentlich bewirken was es sagt, aber in folgenden Codes kommt gerufener.htm nicht zu Wort.

    Ein zusätzliches allow-same-origin hilft. Warum das notwendig ist, verstehe ich allerdings nicht.

    Bis demnächst
    Matthias

    --
    Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
    1. Hallo mathefritz,

      laut Artikel zu iframe sollte Attribut sandbox="allow-scripts" eigentlich bewirken was es sagt, aber in folgenden Codes kommt gerufener.htm nicht zu Wort.

      Ein zusätzliches allow-same-origin hilft. Warum das notwendig ist, verstehe ich allerdings nicht.

      JA,DANKE, und dann kann das script im rufer auch am Ende des body sein; zum Verständnis trägt dieser Artikel leider auch nichts bei zu klären, warum es OHNE sandbox=... möglich ist.

      Bis demnächst
      Matthias

      Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.

      1. Hallo mathefritz,

        zum Verständnis trägt dieser Artikel leider auch nichts bei zu klären, warum es OHNE sandbox=... möglich ist.

        Mit dem Attribut sandbox legst du fest, dass das Iframe nicht mit seinen Eltern kommunizieren kann.

        Wikipedia: Sandbox ist die englischsprachige Bezeichnung für Sandkiste oder Sandkasten und bezeichnet allgemein einen isolierten Bereich, innerhalb dessen jede Maßnahme keinerlei Auswirkung auf die äußere Umgebung hat.

        Insofern ist es schon richtig, wie sich die Seite verhält.

        Bis demnächst
        Matthias

        --
        Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
    2. Ein zusätzliches allow-same-origin hilft. Warum das notwendig ist, verstehe ich allerdings nicht.

      Dann wird das Sandboxing allerdings ineffektiv, weil ein Skript innerhalb des iframes einfach das sandbox-Attribut vom iframe entfernen könnte. Die Spec warnt ausdrücklich vor dieser Kombination.

      @mathefritz Ich würde dem gesandboxten Skript keinen direkten Zugriff auf den Eltern Browsing-Context geben, sondern postMessage für die Kommunikation verwenden.

      1. Danke 1unitedpower

        @mathefritz Ich würde dem gesandboxten Skript keinen direkten Zugriff auf den Eltern Browsing-Context geben, sondern postMessage für die Kommunikation verwenden.

        es wäre tatsächlich nur Zugriff auf eine Einzige Funktion des parent gewesen,
        aber iframe kommt für das was ich brauche ohnehin nicht infrage, da
        das Elternelement das Iframefenster überschreiben kann, wogegen ich gehofft hatte daß der darüber entstehende Text nach oben scrollen würde
        Rufer

        <!DOCTYPE html>
        <html><head><meta charset="utf-8"></head>
        <body>
        <span id='bf'></span>
        Text wandert in den Iframe hinein<br>
        <a href="javascript:UeberSchreite();">überschreiten</a>
        
           <iframe src="gerufener.htm"
                 style="position:fixed; bottom:0; left:0;width:100%">
          </iframe>
          <script>
             function UeberSchreite(){
                bf = document.getElementById('bf');
                for(i = 0; i < 20; i++) bf.innerHTML += "wir überschreiten<br>"
             }
          </script >
        </body>
        </html>
        
        

        Gerufener

        <!DOCTYPE html>
        <html><head></head>
        <body>
          iframe Text iframe Text<br>
          iframe Text iframe Text<br>
          iframe Text iframe Text<br>
          iframe Text iframe Text<br>
        </body>
        </html>
        

        Ergebnis nach klick auf überschreiten Ergebnis
        also bleibt, wenn man voneinander unabhängige Scrollbereiche haben will, und beachtet, daß Frames nun "mißbilligt" sind, nur die Verwendugn von extra Fenstern

        1. Hallo mathefritz,

          also bleibt, wenn man voneinander unabhängige Scrollbereiche haben will, und beachtet, daß Frames nun "mißbilligt" sind, nur die Verwendugn von extra Fenstern

          Mit Verlaub, das ist Unsinn.

          <!DOCTYPE html>
          <html lang="de">
            <head>
              <meta charset="utf-8">
              <title></title>
              <style>
          	html, body {margin: 0; padding: 0;}
          	div {height: 50vh; padding: 1em; background:olive; overflow-y:scroll}
          	div:first-child {background: orange;}
             </style>
          	
          
            </head>
            <body>
          	<div>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br></div>
          	<div>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br></div>
            </body>
          </html>
          

          Du solltest dir unbedingt angewöhnen darzustellen, was du erreichen möchtest. Dann kann man dir zielgerichtet helfen. Leider sind deine Lösungsansätze häufig nicht wirklich sinnvoll. Hättest du geschrieben „Ich möchte voneinander unabhängige Scrollbereiche, wie geht das?“, hättest du wahrscheinlich schon mehrere zielführende und ausbaufähige Ideen.

          Bis demnächst
          Matthias

          --
          Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
          1. Danke für Deine Mühe Matthias Apsel,
            wunderbar

            Du solltest dir unbedingt angewöhnen darzustellen, was du erreichen möchtest.

            ja, dann tu ich das mal ganz plump. es geht - wiedereinmal - um
            http://schmieder-laher.de/HardBread/1em.html .
            Die Tastatur sollte einen fixen Platz in der unteren linken Fensterecke haben; darunter wird nichts produziert, sie soll immer voll sichtbar sein. (natürlich darf nicht zu groß gezoomt sein, und für kleine Tablets wird das Programm ungeeignet sein.)
            Es müßte also für den Teil darüber eine Höhe festgelegt werden, und das ist etwas schwierig.
            Ich habe mal
            zu Beginn des body <div style="height:25em; overflow-y: scroll>" und vor Bginn der <table id="Tastatur" ... das </div> gesetzt, mit verschiedenen height Werten, also nicht nur 25em versucht, komme aber zu keinem befriedigendem Ergebnis, der scroll erfolgt nicht nach oben, sondern der Text verschwindet oft unter der Tastatur; zwar läßt er sich dann nach oben scrollen, ist aber nicht was ich will (und das "Opfer" am Bildschirm, das da ja was lernen soll, wird irritiert ). Zwar gibt es Kombinationen von height, manuell "gezogener" Fenstergröße und Zoom, bei denen es problemlos geht, das findet sich aber nicht leicht.
            ? vielleicht nach jeder Zeile "da oben" ein scrollIntoView ? Gute Nacht!

            1. @@mathefritz

              http://schmieder-laher.de/HardBread/1em.html .
              Die Tastatur […] soll immer voll sichtbar sein.

              Was sollte auch sonst sichtbar sein?

              Ach so, daneben ist ja noch eine Grafik. Neben dieser … ist das Text?

              Darüber ist eine rote Line. Über dieser: was sollen die grauen horizontalen Linien da?

              LLAP 🖖

              --
              “I love to go to JS conferences to speak about how to avoid using JavaScript. Please learn CSS & HTML to reduce your JS code bloat.” —Estelle Weyl
              1. Hallo Gunnar,
                ja, das neben dem Dreieck ist Text, mit eingebetteten Graphiken ( letztere sind die mSh,mSc,mSA,mSAQ in den Zeilen 38,39,40 in Datei
                schmieder-laher.de/HardBread/Initialisierungen.js ) .
                Die
                grauen Kästchen ( es sind nicht nur horizontale Linien ) deuten die ungefähre Größe und Position der Formeln an durch die die Kästchen, nach passenden Klicks auf der Tastatur, ersetzt werden.
                Jeweils nach dem Klick der ein Formelzeile vervollständigt wird der Tabelle (Zeile 113 in 1em.html ) eine neue "Kästchen"-Zeile angefügt.
                Wie es dann aussieht zeigt sich ohne klicken wenn man, nach dem Laden, den Debugger startet und in der Konsole Vorlauf() kommandiert. In der Version auf der Webseite ist Matthiasens Vorschlag noch nicht angewandt.
                Gruß Fritz

                1. @@mathefritz

                  Die grauen Kästchen ( es sind nicht nur horizontale Linien )

                  Doch, doch, es sind Linien. Die scheinen allerdings nicht überall dieselbe Dicke zu haben und auch innendrin Lücken. Vor einigen dieser Linien sind noch schwarze Punkte.

                  LLAP 🖖

                  --
                  “I love to go to JS conferences to speak about how to avoid using JavaScript. Please learn CSS & HTML to reduce your JS code bloat.” —Estelle Weyl
                  1. @@mathefritz

                    Die grauen Kästchen ( es sind nicht nur horizontale Linien )

                    Doch, doch, es sind Linien. Die scheinen allerdings nicht überall dieselbe Dicke zu haben und auch innendrin Lücken. Vor einigen dieser Linien sind noch schwarze Punkte.

                    das folgende ist ein Ausschnitt des Bildes das ich bekomme. Siehst Du da auch keine Kästchen, das schwarze "=" auf grünem Hintergrund? Kästchen?

                    1. Hallo,

                      das folgende ist ein Ausschnitt des Bildes das ich bekomme.

                      ach, so sieht das aus. Man muss die Seite also erst vergrößern. :)

                      Gruß
                      Jürgen

                      1. Hallo,

                        das folgende ist ein Ausschnitt des Bildes das ich bekomme.

                        ach, so sieht das aus. Man muss die Seite also erst vergrößern. :)

                        Gruß
                        Jürgen

                        Hallo Jürgen, ich habe auf dem 17"CRT eine Auflösung von 1600*1200, und das Fenster, aus dem der Auschnitt stammt ist circa 860 Pixel breit.

                        1. Hallo,

                          Hallo Jürgen, ich habe auf dem 17"CRT eine Auflösung von 1600*1200, und das Fenster, aus dem der Auschnitt stammt ist circa 860 Pixel breit.

                          schön, aber 11px Schriftgröße ist für mich (und wohl auch für Gunnar) nicht mehr als Text zu lesen.

                          Gruß
                          Jürgen

          2. Hallo Matthias

            gut, habe inzwischen bißchen experimentiert; die heigth des div werde ich wohl dynamisch zu Beginn und bei jedem resize-event, das gottseidank auch beim Zoomen ausgelöst wird, neu festlegen müssen, in Pixeln bestimmt aus innerer Fensterhöhe minus Höhe der "Tastatur" ( siehe 16.11.2016 23:21 )

            Besserer Vorschlag?

            1. @@mathefritz

              ( siehe 16.11.2016 23:21 )

              Wenn du auf ein anderes Posting verweisen möchtest, dann tu das bitte. Mit einem Link. Ich hab das mal für dich gemacht.

              gut, habe inzwischen bißchen experimentiert; die heigth des div werde ich wohl dynamisch zu Beginn und bei jedem resize-event, das gottseidank auch beim Zoomen ausgelöst wird, neu festlegen müssen, in Pixeln bestimmt aus innerer Fensterhöhe minus Höhe der "Tastatur"

              Wenn du beim Layouten/Stylen an JavaScript denkst, tu das bitte nicht! Es ist in so gut wie allen Fällen mit CSS machbar.

              So wie hier. Du willst einen Container (nennen wir ihn foo) über einem anderen (nennen wir ihn bar) plazieren. bar hat eine feste Höhe (sagen wir mal 12.345em), foo und bar sollen zusammen die Bildschirmhöhe ausfüllen (d.h. die Unterkante von bar soll an der Unterkante des Bildschirms liegen).

              Das geht auf mehrere Arten. Die erste hast du selbst in Worten beschrieben: „innere Fensterhöhe minus Höhe der ‚Tastatur‘“. Minus kann ja CSS durchaus rechnen:

              html,
              body
              {
                margin: 0;
                padding: 0;
                height: 100%;
              }
              
              #foo
              {
                height: calc(100% - 12.345em);
              }
              
              #bar
              {
                height: 12.345em;
              }
              

              Die andere, elegantere kommt sogar ohne feste Höhe von bar aus. bar ist so hoch wie es sein Inhalt erfordert; foo nimmt sich den Rest. Flexbox macht’s möglich:

              html,
              body
              {
                margin: 0;
                padding: 0;
                height: 100%;
              }
              
              body
              {
                display: flex;
                flex-flow: column nowrap;
              }
              
              #foo
              {
                flex: 1;
              }
              

              LLAP 🖖

              --
              “I love to go to JS conferences to speak about how to avoid using JavaScript. Please learn CSS & HTML to reduce your JS code bloat.” —Estelle Weyl
              1. Hallo Gunnar,
                danke für Deine Mühe;
                ich habe versucht, Deinen 2ten Vorschlag zu realisieren
                und
                das ganze Paket in ein Archiv gepackt damit Du es am Stück downloaden kannst
                Archiv
                wenn man nach dem Laden ( klick auf 1em.html ) das Fenster so zieht daß die
                Tastatur nicht unter dem unteren Rand rutscht,
                geht es - weiter mit dem Debugger - im Vorlauf(), gut, aber im Nachlauf() wird die
                Tastatur dann doch unter den Rand gedrängt.

              2. und auch in der 1ten Variante, der Obere Teil ist dann upperDiv, schiebt sich beim Nachlauf() der Text unter die Tastatur

              3. nochmals zu Methotde 1:
                ja, wenn man nach dem Laden per Debugger die Tatsächliche Höhe der Tastatur mit Tastatur.offsetHeight abfragt, z.B. 298px bekomm und dann per Debugger im CSS diese statt der 12.345em einträgt, ist das Ergebnis befriedigend; wenn der Programmbenutzer also die Freihet, Zoom- und Fenstergröße zu ändern, behalten soll, werde ich schon das resize-Event
                berücksichtigen müssen . Einfach im Style im head (Tastatur.offsetHeight+"px") statt einer Konstanten eintragen wird ja nicht funktionieren.