属性“contentWindow”在 HTMLElement 类型上不存在 - 从一台服务器发送到另一台服务器

Question

目标/背景：我需要将变量的值从我的 Angular 应用程序发送到页面上 iFrame 内的 ChatServer（aspx with javascript）。它在不同的服务器上。

我试过 的：我在这里遵循解决方法： https ://stackoverflow.com/a/25098153/11187561

但是，我收到 错误 消息：属性“contentWindow”在 HTMLElement 类型上不存在

接下来我还尝试了什么：通过 SO，我发现 https://stackoverflow.com/a/38457886/11187561

我将它放在 ngAfterViewInit 中，但仍然出现错误。

代码：

 ngAfterViewInit() {
    var frame = document.getElementById('your-frame-id');
    frame.contentWindow.postMessage(/*any variable or object here*/, '*');
}

原文由 angleUr 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

问题是 getElementById 返回 HTMLElement 而不是 HtmlIFrameElement 。你可以做的是定义一个类型保护来检查 frame 是一个 IFRAME 。第二个问题是 contentWindow 可以为空，所以我们也必须检查它。

 const isIFrame = (input: HTMLElement | null): input is HTMLIFrameElement =>
    input !== null && input.tagName === 'IFRAME';

function ngAfterViewInit() {
    let frame = document.getElementById('your-frame-id');
    if (isIFrame(frame) && frame.contentWindow) {
        frame.contentWindow.postMessage({}, '*');
    }
}

原文由 Shaun Luttin 发布，翻译遵循 CC BY-SA 4.0 许可协议