我可以在Wordpress网站上为聊天机器人调整iframe的大小吗

问题描述

我目前正在尝试将iframe嵌入到WordPress网站的窗口小部件中，该iframe是一个按钮，当按下该按钮时，它会扩展一个聊天机器人窗口。

因此，我无法将iframe设置为静态高度/宽度，因为当聊天窗口最小化（并且在iframe中仅看到按钮）时，我想将iframe调整为较小的尺寸（即类似按钮的大小）以允许访问父网站上的任何按钮/元素，并且没有覆盖这些交互式元素的空白iframe元素。

我尝试通过跨站点脚本执行此操作，以在iframe中的按钮上添加事件，但是，出现跨站点起源错误。即使来源相同。我还向标头添加了Access-Control-Allow-Origin策略和x-frame-options策略。

当前正在尝试将div包裹在iframe周围，并创建一个将调整iframe大小的onclick事件，并考虑使用Message.Post（）。

var iframe = document.getElementsByTagName('iframe')[0];

iframe.onload = function () {

    console.log(iframe);

    var iframeDocument = iframe.contentDocument || iframe.contentwindow.document;
    console.log(iframeDocument); //Cross Origin Error Here

    var btn1 = iframeDocument.getElementById('chatbotBtn');
    console.log(btn1);
}

iframe和网站共享同一个域。

想知道是否有更好的做法，我可以使用它来创建可动态调整大小的iframe，或者Message.Post是可行之路？

谢谢

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

botframework html iframe javascript