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

Question

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

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

但是，我得到了 错误 :
HTMLElement 类型上不存在属性“contentWindow”

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

我将它放在 ngAfterViewInit 中，但我仍然收到错误消息。

代码 :

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

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({}, '*');
    }
}