zoukankan      html  css  js  c++  java
  • H5新增的postMessage跨域解决方案Demo

    Demo背景:html中使用iframe嵌入了跨域的vue项目,在html中将参数传入到跨越的vue项目中。

    向跨越的子窗口中发送数据

    function sendMessage(data) {
        // 通过 postMessage 向子窗口发送数据
       document.querySelector(".ifm_analysis").contentWindow.postMessage(data, "*")
    }

    在跨越的子窗口中接收数据

    // 记录vue实例地址的变量
    let currVM
    window.addEventListener("message", receiveMessage, false);
    function receiveMessage(event) {
        // event.source.postMessage("", event.origin);
        // 页面转入子窗口页面时,启动检测监听的参数
        if (document.location.href.indexOf("consignew") > -1) {
            // 调用vue实例中的searchConsignsByIdArr方法
            currVM.searchConsignsByIdArr(event.data)
        }
    }
  • 相关阅读:
    PHP 学习轨迹
    beego 遇到的一些问题
    Fiddler 502问题
    SourceTree
    Trait
    PHP PSR 标准
    解决MySQL联表时出现字符集不一样
    Git 代码管理命令
    PHP 运行相关概念
    CentOS 7
  • 原文地址:https://www.cnblogs.com/sangzs/p/8559118.html
Copyright © 2011-2022 走看看