如何为电报小工具正确使用JavaScript postMessage API？

Question

我正在尝试将电报频道帖子小部件嵌入到宽度比嵌入脚本生成的iframe宽度小的宽度的网页侧边栏中。脚本使用postMessage API并处理message事件以设置小部件的高度和宽度，请参见“ postMessageHandler”函数like this。它甚至在postMessage中传递高度，并且甚至从父页面监听相似的高度，以获取iframe的高度和宽度。我想将高度和宽度传递给iframe。

我尝试使用$( document ).ready()和$(window).on('load',...)处理程序来传递消息，但这是行不通的。

$('iframe').on('load',function(){

    $(this).get(0).contentWindow.postMessage(
        {
            event:'resize',
            height:600,
            width:400
        },
        'https://t.me'
    );
});

我可以通过以下方法监听iframe事件并查看传递的数据：

$(window).on('message', function(evt){
    console.log(evt);
});

here中给出的嵌入脚本就是这样。

<script async src="https://telegram.org/js/telegram-widget.js?4" data-telegram-post="telegram/83" data-width="100%"></script>