This is a simple little app that just loads webviews for each goggle app
Created in qml using qt.webengine, but getting errors on out of date web browser
I am not going to update to Qt 6 for a while so i wanted to try to covert this to html
not an html expert so bear with me
I tried using navbar from bootstrap and iframes, but cannot retain login info with iframes…?
i see bootstrap has an embed function how could i emebed an external website like iframe option?
<html>
<body style="text-align:left;">
<!-- Load an icon library -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="index.css">
<div class="view">
<iframe src="#" name=viewPort width=85% height=100% scrolling=auto frameborder=0></iframe>
</div>
<!-- The sidebar -->
<div class="sidebar">
<a href="https://mail.google.com/" target='viewPort'><i class="fa fa-solid fa-inbox"></i> Inbox</a>
<a href="https://calendar.google.com/calendar/u/0/r" target="viewPort"><i class="fa fa-regular fa-calendar"></i> Calendar</a>
<a href="https://contacts.google.com/" target='viewPort'><i class="fa fa-regular fa-address-card"></i> Contacts</a>
<a href="https://voice.google.com/u/0/calls" target='viewPort'><i class="fa fa-solid fa-phone"></i> VOIP</a>
</div>
</body>
</html>
here is what i have so far https://jsfiddle.net/8k2L5oqx/
Is this even possible with html?
any pointers appreciated
2
Answers
after more googling seems google blocks iframes acccess The reason for this is, that Google is sending an "X-Frame-Options: SAMEORIGIN" response header. This option prevents the browser from displaying iFrames that are not hosted on the same domain as the parent page.
To convert your QML WebEngine app to HTML5, avoid using iframes for Google services due to security restrictions; instead, redirect users directly to the sites and consider using Bootstrap for navigation without embedding.