javascript - 跨域监听 iframe 中的 keydown 事件

标签 javascript angularjs iframe cross-domain

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

错误是:

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

Chrome:“未捕获的安全错误:无法从‘HTMLIFrameElement’读取‘contentDocument’属性:阻止来源为“domain_a”的框架访问来源为“domain_b”的框架。协议(protocol)、域,并且端口必须匹配。”

有什么方法可以监听来自另一个域的 iframe 上的按键事件吗?

我使用这个 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();
        });
    }

最佳答案

没有。你不能这样做,它与 AngularJS 无关。这是一种安全违规行为,专门用于防止您在 Bank of America 中使用 IFRAME 进入您自己的站点并从该框架中窃取用户的凭据。

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

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

本质上,您将击键捕获在 IFRAME 中,然后将包含详细信息的消息发送回父级。浏览器允许这样做,因为它是自愿和合作的 - 你必须同时控制发送者和接收者,所以它不能用于在用户不知情的情况下窃取用户的东西。

关于javascript - 跨域监听 iframe 中的 keydown 事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25995337/

相关文章:

javascript - IE 开发者工具栏 : How to debug javascript?

javascript - 防止使用 ng-model 进行动态更改

html - 当我在代码中使用特定的 svg 时,所有 svg 的颜色都会变为红色

javascript - 从一个网络应用程序到另一个网站提供复杂内容(考虑整个网页树)的最佳可重用解决方案是什么?

javascript - ng-src 不会在 url 参数更改时更新 iframe

javascript - iframe 中的页面顶部

javascript滚动效果在angularjs Controller 中不起作用

javascript - ASP.NET 中带有确认框的弹出窗口

javascript - 解析服务器 Node.js SDK : Alternative to Parse. User.become?

AngularJS 的 $http.post() 每次发送两个 AJAX 请求,一个没有数据,一个有