Sie sind nicht angemeldet.

Urgent! Gyro2 disabled with link cloaking

bhh

Schüler

  • »bhh« ist der Autor dieses Themas

Beiträge: 67

  • Nachricht senden

1

Mittwoch, 17. Oktober 2018, 23:21

Urgent! Gyro2 disabled with link cloaking

So I admit this is a weird and unique situation but I'm desperate for a solution.

We've implemented a CMS for a client that allows them to send out tours to clients and we're using a link shortening service that allows the content to live on our server but the links that get sent out to clients are branded under our clients domain. If we turn on link cloaking so that the URL in the client's window is the shortened, client branded link rather than the full URL on our server, everything works fine EXCEPT the gyro2 plugin gets disabled on IOS and Android devices (all we've tested). Everything else works fine and the gyro plugin is enabled originally but an ondisable event is firing as evidenced in the code snipped below. The gyro2 source code is encrypted but is there is anything in there that would be causing this? If we disable link cloaking through the link shortening service, the gyro works fine. Also tested the the original gyro.js code and the same thing happens with that as well.

<plugin name="skin_gyro" keep="true" url="%SWFPATH%/plugins/gyro2.js" html5_url="%SWFPATH%/plugins/gyro2.js" softstart="1.0" enabled="true" onavailable="trace('gyro available')" onunavailable="trace('gyro unavailable')" onenable="trace('gyro enabed')" ondisable="trace('gyro disabled')" devices="html5" autocalibration="false"/>

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »bhh« (18. Oktober 2018, 00:15)

bhh

Schüler

  • »bhh« ist der Autor dieses Themas

Beiträge: 67

  • Nachricht senden

2

Freitag, 19. Oktober 2018, 16:49

The URL shortening service we are using as said they will be able to provide a fix so a Krpano work around won't be needed. *thumbsup*

klaus.krpano

Administrator

Beiträge: 13 499

  • Nachricht senden

3

Samstag, 20. Oktober 2018, 07:51

Hi,

sounds like your URL shortening service is embedding the page into an iframe (btw - why?) and many browsers are blocking the gyro-usage inside iframes from external servers.

Best regards,
Klaus

bhh

Schüler

  • »bhh« ist der Autor dieses Themas

Beiträge: 67

  • Nachricht senden

4

Montag, 5. November 2018, 23:02

Hi Klaus,
Thank you for responding and I apologize I tool so long to get back to you. I was out of the office last week dealing with a family emergency.


Yes, I think you are correct they are using iframes but only when we enable url masking which our client wanted. Link masking conceals the actual content URL in the address bar so the end user can not see/book mark the actual URL and only has access to the shortened URL. Their main reason for wanting this is to make links expirable by removing the short-link without affecting the actual content on the server.

They were able to solve it for Android devices but not for iOS so we ended up having to disable url masking. The shortening service did provide a workaround that could be implemented but I don't believe this is something I can do directly as I believe it would have to be modified in the core KRPANO or GYRO2 code? Is source code for GYRO2 available?

START QUOTE

Do you have access to the application code? It is not possible to send event directly, but we use postMessage to send this event data.


Here is what we do:
window.addEventListener('devicemotion', function(e) {
iframe.contentWindow.postMessage({
type: 'devicemotion',
deviceMotionEvent: cloneDeviceMotionEvent(e),
}, '*');
});


If you can handle this message - you can get devicemotion event.


Here is a documentation about window.postMessage https://developer.mozilla.org/en-US/docs…dow/postMessage


END QUOTE

klaus.krpano

Administrator

Beiträge: 13 499

  • Nachricht senden

5

Dienstag, 6. November 2018, 23:52

Hi,

yes, will be possible - I have added support for that code now:

Zitat von »bhh«

window.addEventListener('devicemotion', function(e) {
iframe.contentWindow.postMessage({
type: 'devicemotion',
deviceMotionEvent: cloneDeviceMotionEvent(e),
}, '*');
});

That means when the external page is sending the gyro events this way, the new gyro2.js plugin will be able to receive them.

Here a new gyro2.js file for testing (will be also included in the next krpano release):
gyro2.zip

Best regards,
Klaus

bhh

Schüler

  • »bhh« ist der Autor dieses Themas

Beiträge: 67

  • Nachricht senden

6

Dienstag, 6. November 2018, 23:57

Thank you! *thumbsup*

moyosa

Anfänger

Beiträge: 11

  • Nachricht senden

7

Donnerstag, 27. Dezember 2018, 11:39

Seems to be working yes, but when you navigate by touch the gyro stops working.

Anybody else experiencing this with the update gyro2.js?

ksridharamurthy

Anfänger

Beiträge: 1

  • Nachricht senden

8

Donnerstag, 14. Februar 2019, 18:16

I think I have a similar issue. I get an error message below on chrome on android. I also tried to replace gyro2.js with the new one and it didn't make any difference :|

VM52:3 The devicemotion events are blocked by feature policy. See https://github.com/WICG/feature-policy/blob/master/features.md#sensor-features
gs @ VM52:3
VM54:3 The devicemotion events are blocked by feature policy. See https://github.com/WICG/feature-policy/blob/master/features.md#sensor-features

klaus.krpano

Administrator

Beiträge: 13 499

  • Nachricht senden

9

Freitag, 15. Februar 2019, 16:22

Hi,

inside iframes the gyro usage is blocked.

Use the new gyro2.js from this thread and add this code in the top-most-frame:

Quellcode

 
1
2
3
4

<script>
var pano_iframe_name = "enter_here_the_id_of_your_iframe_element";
window.addEventListener("devicemotion", function(e){ var iframe = document.getElementById(pano_iframe_name); if (iframe) iframe.contentWindow.postMessage({ type:"devicemotion", deviceMotionEvent:{ acceleration:{ x:e.acceleration.x, y:e.acceleration.y, z:e.acceleration.z }, accelerationIncludingGravity:{ x:e.accelerationIncludingGravity.x, y:e.accelerationIncludingGravity.y, z:e.accelerationIncludingGravity.z }, rotationRate:{ alpha:e.rotationRate.alpha, beta:e.rotationRate.beta, gamma:e.rotationRate.gamma }, interval:e.interval, timeStamp:e.timeStamp } }, "*"); });
</script>


Best regards,
Klaus

indexofrefraction

Profi

Beiträge: 1 362

  • Nachricht senden

10

Sonntag, 17. Februar 2019, 12:14

i extended it like this and added it to my main index.html

<script>
if(window != window.top) {
var pano_iframe_name = "enter_here_the_id_of_your_iframe_element";
window.top.addEventListener(.....);
}
</script>

but couldn't / shouldn't something like this be done directly in gyro2.js ?
or is that only working in the same domain?
zFilter plugin -- zFlare plugin -- zSnapshot plugin

Dieser Beitrag wurde bereits 3 mal editiert, zuletzt von »indexofrefraction« (17. Februar 2019, 12:34)

klaus.krpano

Administrator

Beiträge: 13 499

  • Nachricht senden

11

Sonntag, 17. Februar 2019, 20:21

Hi,

you can't access window.top inside cross-domain pages.
That would cause a security error.

Best regards,
Klaus

granton

Anfänger

Beiträge: 20

  • Nachricht senden

12

Mittwoch, 27. Mai 2020, 22:09

Dear Klaus,

We just figured out, that after iOS update to 13.5 the gyro2 inside <iframe> stopped working (tested on krpano 1.20.7).
console: "Blocked attempt to add a device motion or orientation event listener, reason: Source frame did not have the same security origin as the main page."
even once DeviceOrientationEvent.requestPermission() is granted well

Same project works well on 13.3.1 iPad and 13.4.X iPhone as before.
Is there any addition workout possible? Thank you

Best regards,
Granton

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »granton« (27. Mai 2020, 22:21)

Ähnliche Themen