Recently Google Chrome made the changes that by default the following permissions cannot be requested or used by content contained in cross-origin iframes:
Geolocation (getCurrentPosition and watchPosition)
Midi (requestMIDIAccess)
Encrypted media extensions (requestMediaKeySystemAccess)
Microphone, Camera (getUserMedia)
So we have to use the allow attribute with iframe like below:
<iframe src="https://example.com" allow="geolocation; microphone; camera"></iframe>
I want to know how it will effect in case if I use Object tag instead of the iframe?
Thanks in advance.
Related
I have a chat plugin setup through a Banno External Application -> Plugin Card, with authentication via an auth grant flow that works 100% for basic authenticated chat. I am trying to get our Twilio embedded video for our chat-service to connect inside in the Banno Dashboard, and we're having an issue with Camera and Microphone access/permissions. If I run our service in full screen mode, outside of the Banno Dashboard iframe, the video works 100%. If I then try and run inside the Banno Dashboard iframe, the video doesn't auto-start (even though autoplay and muted are set to true for our HTML video tag), and I get an "Not allowed to call getUserMedia" error.
When looking at the iframe provided by Banno it appears to have the sandbox attribute set, which I think is knocking down autoplay, and hence causing our twilio video not to start, but rather present "play" buttons. The sandbox attribute says it enables an extra set of restrictions for the content in an iframe, and my guess it that's stopping the video from starting.
The iframe HTML tag with the sandbox attribute I see is below:
<iframe scrolling="no" frameborder="0" sandbox="allow-top-navigation-by-user-activation allow-scripts allow-forms allow-same-origin allow-downloads allow-modals" referrerpolicy="strict-origin-when-cross-origin" no-footer="" src="https://--first party URI is here inserted--/?channel=mobile"> </iframe>
My question is does anyone have video working under a Banno Plugin Card/Exernal Application, and how did you get around the iframe sandbox autoplay and camera/mic permission issues inside the Banno Dashboard?
It sounds like you're encountering some of the Restrictions that are part of the Plugin Framework.
Accessing the microphone isn't currently listed as an explicit restriction, but would fall under the "Native APIs / Operating System APIs" section. (We'll get the docs updated to clarify this specific restriction.)
The sandboxing attributes (same link as above) prevent autoplaying video in the plugin's Card Face.
Summary
My Site requires the SharedArrayBuffer support. Therefore we need to enable Cross-Origin Isolation on our site, which will be depreciated primarily on Chrome starting Chrome 92. However, apparently, Youtube embed URLs do not appear to have support for sites that enable Cross-Origin Isolation?
Attached below it mentions that the cross-origin-resource-policy is not set and blocked by the cross-origin isolation, from the YouTube embed document.
My question is that is it actually not supported or there is an option that I am missing to make youtube embed works on a cross-origin isolated site? Otherwise, I'll need to figure out some other workarounds.
I'm trying to embed photospheres into Squarespace.
Google Maps works fine, but doesn't suit my needs and looks as follows:
<iframe src="https://www.google.com/maps/embed?pb=!1m0!3m2!1sen!2sus!4v1471028758208!6m8!1m7!1sF%3A-hjcchX5MD5g%2FV03OAcggYUI%2FAAAAAAAAKeM%2FXwIrucnK4IQkwWbhxu9BrvOATMYZaMmKgCLIB!2m2!1d37.870246!2d-119.360704!3f125.91384035181916!4f6.045852307800146!5f0.7820865974627469" width="100%" height="800" frameborder="0" style="border:0" allowfullscreen></iframe>
Instead, I want to embed via sphereshere.net Their embed looks as follows but DOESN'T work.
<iframe src="http://sphereshare.net/#!/e/c467ba7af9753ee287cd44550493e966" height="320" width="620" frameborder="0"></iframe>
What do we think is the problem?
Usually, in cases like this, the problem is the use of the http protocol in an iframe while you're still logged into Squarespace via https. You should try to view the page while not logged in, being sure you're viewing the page via http and not https. If you provide a link to the page, I'm happy to take a look as well.
The reason for this has to do with browser security. Loading a resource over http while viewing the parent website over https is a potential security risk, so browsers do not allow it. Google maps supports loading over https (and you can see the link you're using for Google Maps uses https). Whereas sphereshare.net does not support https, so you're using http. When logged into Squarepace, you're loading the website over https but the sphereshare iframe over http, so browsers do not allow it.
In the future, hopefully you'll be able to use https with sphereshare, then it would work in either case. Until then, you'll have to log out and set your protocol to http in order to view iframes loaded over http.
We are able to add Youtube, Sway and Office Mix content using the "Online Videos" ribbon command in OneNote 2016 with Class Notebook Add-in which are played in place when a user accesses them.
We want to be able to do the same and embed iframes of external content via OneNote Class Notebook or Notebook API but couldn't find any documentation for the same.
Please help with the HTML/XML tags/markup to use to do the same.
You can do this via the POST or PATCH ~/pages API by adding the following iframe component in the html request body.
NOTE: This is an example only:
<iframe width="600" height="338" data-original-src="https://www.youtube.com/watch?v=a-BOSpxYJ9M"></iframe>
The important part is to specify the data-original-src attribute. And note this is the original url of the video (not the embed url e.g. the url fetched in sites like youtube from clicking Share).
Could you help me understand Chrome implementation of HTML5 iframe sandbox attributes allow-same-origin and allow-top-navigation?
First question:
For example when i test allow-same-origin I do:
<iframe id='frm' src="file.html" sandbox="allow-same-origin"></iframe>
...
oIFrame = document.getElementById('frm');
var oDoc = (oIFrame.contentWindow || oIFrame.contentDocument);
if (oDoc.document) {
oDoc = oDoc.document;
oDoc.getElementById('foo').innerText = 'Hello man!';
...
Content of file.html:
...
<div id="foo">Hello</div>
...
alert(document.cookie);
...
and that's work only when i have additional attribute called allow-scripts so I have sandbox="allow-scripts allow-same-origin". Alone allow-same-origin doesnt't work and alone allow-scripts works great (scripts run but not API SOP related, its ok regard to HTML5 standard).
Standard of HTML5 says:
"First, it can be used to allow content from the same site to be sandboxed to disable scripting, while still allowing access to the DOM of the sandboxed content."
Am I misunderstand that or Chrome implementation is wrong?
Second question:
Standard of HTML5 says about allow-top-navigation:
"Second, it can be used to embed content from a third-party site, sandboxed to prevent that site from opening popup windows, etc, without preventing the embedded page from communicating back to its originating site, using the database APIs to store data, etc."
My popups in Chrome aren't blocked. How could I block them? I use just allow-top-navigation.
Cheers,
David
For the first question:
It appears this means that the parent page can still have access to the DOM of the sandboxed <iframe>, whilst scripts in the <iframe> itself are blocked from execution; so it's only parent -> iframe but not iframe -> parent
Second question:
Maybe I'm misunderstanding, but as the name allow-top-navigation implies this will allow rather than block the framed site from using things like top.location.replace().