对接《一体化政务数据门户V3.0》规范

1. 页面及对应的路由地址信息集

1.1 pc门户

菜单名称 访问地址(后缀)
首页 /portal/home

详见后期表格

1.2 pc个人中心

菜单名称 路由地址(后缀)
首页 /manager/xxxx

详见后期表格

1.3 移动端

菜单名称 路由地址(后缀)
首页 /portalApp/xxxxx

详见后期表格

2. 页面通讯规则

iframe postMessage 是一个用于在不同的网页或域之间进行安全通信的 API。它允许在一个网页的嵌入框架(iframe)内的内容,与包含它的父级网页进行双向通信。通过 postMessage 方法,可以向 iframe 发送消息,同时也可以监听 iframe 发送的消息。这样可以实现跨域通信,以及在不同网页之间共享数据和调用函数等操作。

消息数据格式:

{
   // 类型
   IGDPType: '',
   // 地址
   IGDPUrl: '',
   // 参数
   defaultParams: {}
 }
  • IGDPType 必填,可选值IGDP_OPEN_WINDOWIGDP_CUR_WINDOWIGDP_OPEN_DIALOG
说明
IGDP_OPEN_WINDOW 新开widow窗口打开页面
IGDP_CUR_WINDOW 当前窗口打开页面
IGDP_OPEN_DIALOG(待开发) 显示弹出框
IGDP_WINDOW_GO 返回
  • IGDPUrl 必填,可选值详见 页面及对应的路由地址信息集,如果IGDPType配置的是IGDP_OPEN_DIALOG,则是对接系统自己的可访问的地址url。
  • defaultParams 选填

2.1 子系统向上通讯

let params = {
   // 类型 
   IGDPType: 'IGDP_OPEN_WINDOW', // IGDP_OPEN_WINDOW / IGDP_CUR_WINDOW
   // 地址 根据门户定义规则,子系统选择 需要展示在门户哪个页面
   IGDPUrl: '/portal/res',
   // 参数
   defaultParams: {
     info: 'ccccccc'
   }
 }
 window.top.postMessage(JSON.stringify(params), '*')

2.2 门户接收

    window.addEventListener('message', this.handleIframeEvent, false);
	// 使用 子 ==> 父
    handleIframeEvent(ev) {
      if (typeof ev.data !== 'string') {
        return false
      }
      let evData = JSON.parse(ev.data)
      const IGDPType = evData.IGDPType || null;
      const query = evData.defaultParams ? evData.defaultParams : {}
      if (IGDPType === 'IGDP_OPEN_WINDOW') {
        let routeUrl = this.$router.resolve({
          path: evData.IGDPUrl || '/',
          query: query
        });
        window.open(routeUrl.href, '_blank');
      } else if (IGDPType === 'IGDP_CUR_WINDOW') {
        this.$router.push({
          path: evData.IGDPUrl || '/',
          query: query
        })
      } else if (IGDPType === 'IGDP_WINDOW_GO') {
        this.$router.go(evData.IGDPUrl || '-1')
      }
    }

你可能感兴趣的:(前端)