需求源自一个客户，多渠道推广需要。因为渠道比较多，不能完全依靠商桥等媒介。咨询过某些客服系统，发下没有类似功能。

客户找了另一家的页面效果，是js直接页面动态插入from表单实现。直接拿到代码线上测试，发现会因为页面不同情况，有弹窗代码被页面本身css影响，导致弹窗样式错乱问题。第一版，如果用，必须让之后做单页的技术人员，避免css冲突。不实际，于是尝试改进。

第二种思路，采用iframe嵌入表单。当iframe表单信息提交后，本身进行页面特定元素标记，并且父页面创建轮训，检测iframe内标记情况，当检测到标记的时候，关闭iframe。思路是这样，但实际运行发下，因为跨域问题，执行并未达到想要的效果。

经过一番搜索，发现国外有两种解决跨域的思路。
1）利用hash-hack方式
该方式和思路二类似，同样是自身的标记。并未采用。
2）利用Window.postMessage()，进行iframe和父辈通信
window.postMessage() 方法可以安全地实现跨源通信。
通常，对于两个不同页面的脚本，只有当执行它们的页面位于具有相同的协议（通常为https），端口号（443为https的默认值），以及主机  (两个页面的模数 Document.domain设置为相同的值) 时，这两个脚本才能相互通信。
以一种合适的方式，规避js不安全因素，达到页面间通信。

按照Window.postMessage()思路，消除了iframe跨域不安全限制问题。重新编写代码。运行测试可以正常使用。

iframe内，发出关闭命令部分代码
http://s7/mw690/001NIuQazy7jIvC2dx426&690


iframe父辈接收命令并移除iframe弹窗显示
http://s7/mw690/001NIuQazy7jIvC47j096&690


具体使用是需留意浏览器兼容性方面。

参考资源：
mozilla window.postMessage
Cross-Domain Iframe Resize
Hash-Hack for Cross-Domain IFrame Communication