通过监听message对ifram接口返回值做出回调

在某些场景下，我们通过ifram引入了第三方页面且需要对该页面的接口返回值做出一些判断的时候就可以利用监听message方法来达到目的（此处不讨论同域下，子页面调用父页面方法的情况）。

首先我们需要确认ifram加载完毕，因为ifram可能因为各种原因导致加载缓慢，之类用到了ifram.onload。然后再对message进行监听，代码如下

function getcode() {
  var iframe = document.getElementById("ifrm");
  if (iframe) {
    iframe.onload = function () {
      window.addEventListener('message', function (messageFromIframe) {
        if (messageFromIframe.data.status === 200 || messageFromIframe.data.status === 201) {
          // do something
        }
      })
    }
  } else {
    setTimeout(getcode(), 500);
  }
}

除了通过ifram.onload我们还可以通过iframe onreadystatechange事件来监听ifram,这里需要注意的是iframe加载页面的过程中会触发三次onreadystatechange事件，对应的情况分别是loading,interactive和complete，我们这里需要的是第三种情况。

var ifram = document.getElementById('ifrm');
ifram.onreadystatechange = function() {
  if (this.readyState && this.readyState == 'complete') {
    onComplete();
  }
}