How to embed flutter web in HTML as a iframe (fullscreen)?

user_4238647 0
Viewed 412

I want to display a specific link of my flutter web app in an iframe.

Purpose: Create multiple dynamic websites on custom domains managed with 1 flutter web app

Things I have tried:

  1. Making iframe dynamic using javascript code, but onLoad does not trigger
  2. iframe with 100% height and width does not work

Problem: 100% width works fine using: <meta name="viewport" content="width=device-width, initial-scale=1"> but the height does not take up the entire space

flutter embed iframe html
1 Answers

Finally figured out how to do it.

        iframe {
            width: 100% !important;
            min-width: 100%;
            height: 100vh !important;
            align-self: center;
            border: 0;
        }

The important thing to note was that scroll was not working when flutter web was put in iFrame in Safari.

Solution:

 <script>
        document.addEventListener('touchstart', {});
 </script>
user_42386470
Related