使用跨域侦听iframe中的keydown事件

时间:2014-09-23 12:38:46

标签: javascript angularjs iframe cross-domain

我想在iframe中监听keydown事件以阻止执行后退空间。 只要iframe中的页面来自同一个域,它就可以工作,但是当它来自另一个域时,它会在调用contents()方法时失败。

错误是:

IE:" 0x80070005 - JavaScript运行时错误:访问被拒绝。"

Chrome:" Uncaught SecurityError:无法阅读' contentDocument'属性来自' HTMLIFrameElement':阻止了一个有起源的框架" domain_a"从访问带有起源的框架" domain_b"。协议,域和端口必须匹配。"

有没有办法在其他域名的iframe上侦听keydown事件?

我使用此angularJS代码来设置一个监听器:

KeyDownService.preFilterKeyDown($(this).contents());
...
angular.module('portal.services.keyHandlers.keyDownService', [])
.service('KeyDownService', function () {
    //Prevents shortcut keys (for instance backspace) in being executed in an iframe or document.
    this.preFilterKeyDown = function ($document) {
        $document.keydown(function (e) {
            var preventKeyPress;
            switch (e.keyCode) {
                case 8: //Backspace
                    preventKeyPress = preventBackspace(e);
                    break;
...
                default:
                    preventKeyPress = false;
            }

            if (preventKeyPress)
                e.preventDefault();
        });
    }

1 个答案:

答案 0 :(得分:1)

没有。你不能这样做,它与AngularJS无关。这是一种安全违规行为,专门用于防止您将美国银行的IFRAME带入您自己的网站并从该网站窃取用户的凭据。

但是,如果您控制两个页面,您可以让IFRAME自愿为您提供数据。 postMessage是一种常用技术:

http://caniuse.com/#search=postMessage

基本上,您可以在IFRAME中捕获击键,然后使用详细信息将消息发送回父级。浏览器允许这样做,因为它是自愿和合作的 - 你必须控制发送者和接收者,所以它不能被用来从用户那里偷东西而不知道它。