尝试在跨域修复后尝试重新加载iframe元素时出现持续错误

Question

我有一个嵌入了iFrame的网页。 iFrame来自同一域（在本例中为localhost）。

我遇到此错误：

  

阻止了源为“ http://www .. com”的框架访问   跨域框架。

因此，我做了一些研究，并决定实施我发现的一个“修复”。

这就是我的设置方法。

在我的GameMedia.aspx页面中，我有以下javascript：

<script src="scripts/avatarManager.js"></script>

我在HTML中有这个iFrame：

<div id="monsterGallery">
     <iframe id="avatarList" src="monsterList.aspx?gameID=<%=gameID%>"></iframe>
</div>

在avatarManager.js中，我有这个：

var frame = document.getElementById('avatarList');

frame.contentWindow.postMessage("avatarManager-reload-iframe", '*');

window.addEventListener('message', function (event) {
    if (event.data === "avatarManager-reload-iframe") {
        updateAvatarList();
    }
});

function updateAvatarList() {
    document.getElementById("avatarList").contentDocument.location.reload(true);
}

现在我在avatarManager.js中遇到此错误：

  

未捕获的TypeError：无法读取null的属性“ contentWindow”

在此行：

frame.contentWindow.postMessage("avatarManager-reload-iframe", '*');

我不太确定为什么会这样。我将“可变框架”设置为等于我的iFrame元素。

有什么我想念的吗？

谢谢！