I defined an iframe
in my html and want to add keyboard listener on it. Below is the code:
const iframe = $(myId).find('iframe')[0];
iframe.requestFullscreen();
$(iframe)[0].contentWindow.document.keydown((e) => console.log('keydown', e));
it makes the iframe fullscreen and attach the keydown event. The fullscreen works fine but I got Uncaught DOMException: Blocked a frame with origin "http://localhost:8080" from accessing a cross-origin frame.
error. I think it is a browser policy but I wonder whether I can get rid of it. If not, is there any way for me to add iframe key event control?
I have checked this post:
SecurityError: Blocked a frame with origin from accessing a cross-origin frame
It answers part of my question. If I can capture keyboard event in an iframe, then I can use the method mentioned in that post to solve the message communication between main and iframe window issue. But I couldn't find an answer that how to add keyboard/mouse listeners on an iframe.