Appearance

Iframe嵌套 ​

父窗口 ​

实现登陆事件发送给iframe嵌套页面，并接收子窗口传过来的操作事件 ​

一、发送类型介绍 ​

1. 登陆 ​

js
  //登陆参数
        let projectId = document.querySelector('.projectId').value = '20020001001'
        let token = document.querySelector('.token').value = 'D343FCD9177CF56F35128593ECEE5F00'
        let agentNumber = document.querySelector('.agentNumber')
        let extensionPassword = document.querySelector('.extensionPassword').value = '123456'
        let initType = document.querySelector('.initType')
        let extensionNumber = document.querySelector('.extensionNumber')
        let initialState = document.querySelector('.initialState').value = 2
        let phoneNumber = document.querySelector('.phoneNumber')
        let iframebox = document.querySelector('.iframebox')


        //登陆
        let login = document.querySelector('.login')
        login.addEventListener('click', function () {
            let data = {
                type: 'dk_submitLogin',
                projectId: projectId,
                token: token,
                agentNumber: agentNumber.value,
                extensionPassword: extensionPassword,
                initType: initType.value,
                extensionNumber: extensionNumber.value,
                initialState: initialState,
            }
            console.log('登陆', data);
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dk_submitLogin' ，iframe登陆接口传参的必传类型
projectId机构编码
token创建企业时，系统生成的指定token
agentNumber座席号（工号）
extensionPassword分机注册密码
initType初始化类型 取值： 1 - IP话机类型， 2 - webrtc类型，3 - 手机号
extensionNumber分机号
initialState初始状态，取值：2 - 空闲，3 - 忙碌，默认为空闲状态

2. 退出 ​

js
  //退出
        let exit = document.querySelector('.exit')
        exit.addEventListener('click', function () {
            let data = {
                type: 'dky_exitLogin'
            }
            console.log('退出');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_exitLogin' ，iframe退出接口传参的必传类型

3. 退出解绑 ​

js
  //退出
       let exitUnbind = document.querySelector('.exitUnbind')
        exitUnbind.addEventListener('click', function () {
            let data = {
                type: 'dky_exitUnbind'
            }
            console.log('退出解绑');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_exitUnbind' ，iframe退出解绑接口传参的必传类型

4. 呼叫 ​

js
   let outCall = document.querySelector('.outCall')
        outCall.addEventListener('click', function () {
            let data = {
                type: 'dky_outCall',
                phoneNumber: phoneNumber.value
            }
            console.log('外呼');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_outCall' ，iframe呼叫接口传参的必传类型
phoneNumber需要外呼的被叫号码，例如：156****3209

5. 取消外呼 ​

js
  let unoutCall = document.querySelector('.unoutCall')
        unoutCall.addEventListener('click', function () {
            let data = {
                type: 'dky_hangup'
            }
            console.log('取消外呼');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_hangup' ，iframe取消外呼接口传参的必传类型

6. 挂断 ​

js
  let hangup = document.querySelector('.hangup')
        hangup.addEventListener('click', function () {
            let data = {
                type: 'dky_hangup'
            }
            console.log('挂断');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_hangup' ，iframe挂断接口传参的必传类型

7. 拒接 ​

js
     //拒接
        let reject = document.querySelector('.reject')
        reject.addEventListener('click', function () {
            let data = {
                type: 'dky_reject'
            }
            console.log('拒接');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_reject' ，iframe拒接接口传参的必传类型

8. 满意度 ​

js
     let satisfaction = document.querySelector('.satisfaction')
        satisfaction.addEventListener('click', function () {
            let data = {
                type: 'dky_satisfaction'
            }
            console.log('满意度');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_satisfaction' ，iframe满意度接口传参的必传类型

9. 静音 ​

js
      let mute = document.querySelector('.mute')
        mute.addEventListener('click', function () {
            let data = {
                type: 'dky_mute'
            }
            console.log('静音');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_mute' ，iframe静音接口传参的必传类型

10. 取消静音 ​

js
       let unmute = document.querySelector('.unmute')
        unmute.addEventListener('click', function () {
            let data = {
                type: 'dky_unmute'
            }
            console.log('取消静音');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_unmute' ，iframe取消静音接口传参的必传类型

11. 保持 ​

js
     let hold = document.querySelector('.hold')
        hold.addEventListener('click', function () {
            let data = {
                type: 'dky_hold'
            }
            console.log('保持');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_hold' ，iframe保持接口传参的必传类型

12. 取消保持 ​

js
           //取消保持
        let unhold = document.querySelector('.unhold')
        unhold.addEventListener('click', function () {
            let data = {
                type: 'dky_unhold'
            }
            console.log('取消保持');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_unhold' ，iframe取消保持接口传参的必传类型

13. 空闲 ​

js
     let idle = document.querySelector('.idle')
        idle.addEventListener('click', function () {
            let data = {
                type: 'dky_idle'
            }
            console.log('空闲');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_idle' ，iframe空闲接口传参的必传类型

14. 置忙 ​

js
        let busy = document.querySelector('.busy')
        busy.addEventListener('click', function () {
            let data = {
                type: 'dky_busy'
            }
            console.log('置忙');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_busy' ，iframe置忙接口传参的必传类型

15. 接听 ​

js
        let answer = document.querySelector('.answer')
        answer.addEventListener('click', function () {
            let data = {
                type: 'dky_answer'
            }
            console.log('接听');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_answer' ，iframe接听接口传参的必传类型

16. 盲转外线 ​

js
        let BindPhone = document.querySelector('.BindPhone');
        let BindPhoneBtn = document.querySelector('.BindPhoneBtn');
        BindPhoneBtn.addEventListener('click', function () {
            console.log(BindPhone.value);
            let data = {
                type: 'dky_bindPhone',
                number: BindPhone.value
            }
            console.log('盲转外线');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_bindPhone' ，iframe盲转外线接口传参的必传类型
number转接的外线手机号，例如：156****3209

17. 盲转座席 ​

js
     let BindSeat = document.querySelector('.BindSeat');
        let BindSeatBtn = document.querySelector('.BindSeatBtn');
        BindSeatBtn.addEventListener('click', function () {
            console.log(BindSeat.value, '看看这是什么');
            let data = {
                type: 'dky_bindSeat',
                number: BindSeat.value
            }
            console.log('盲转座席');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_bindSeat' ，iframe盲转座席接口传参的必传类型
number要转接的座席号

18. 盲转ivr ​

js
        let NavBindIvrId = document.querySelector('.NavBindIvrId');
        let BindIvrId = document.querySelector('.BindIvrId');
        let BindNodeType = document.querySelector('.BindNodeType');
        let BindIvrIdBtn = document.querySelector('.BindIvrIdBtn');
        BindIvrIdBtn.addEventListener('click', function () {
            let data = {
                type: 'dky_bindIvr',
                data: {
                    NavBindIvrId: NavBindIvrId.value,
                    BindIvrId: BindIvrId.value,
                    BindNodeType: BindNodeType.value
                }
            }
            console.log('盲转ivr');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_bindIvr' ，iframe盲转ivr接口传参的必传类型
data.NavBindIvrId转接的IVR的id
data.BindIvrIdivr节点id BindIvrId和BindNodeType 搭配使用两个参数不传 则默认当前ivrId起始位置播放两个参数传入 则从对应ivr节点开始播放
data.BindNodeTypeivr节点类型BindIvrId和BindNodeType 搭配使用两个参数不传 则默认当前ivrId起始位置播放两个参数传入 则从对应ivr节点开始播放

19. 盲转队列 ​

js
      let BindQue = document.querySelector('.BindQue');
        let BindQueBtn = document.querySelector('.BindQueBtn');
        BindQueBtn.addEventListener('click', function () {
            let data = {
                type: 'dky_bindQue',
                number: BindQue.value
            }
            console.log('盲转队列');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_bindQue' ，iframe盲转队列接口传参的必传类型
number要转接的队列号

20. 咨询 ​

js
        let atxferSeat = document.querySelector('.atxferSeat');
        let atxferSeatBtn = document.querySelector('.atxferSeatBtn');
        atxferSeatBtn.addEventListener('click', function () {
            let data = {
                type: 'dky_atxferSeat',
                number: atxferSeat.value
            }
            console.log('咨询');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_atxferSeat' ，iframe咨询接口传参的必传类型
number要咨询的座席号

21. 咨询转接 ​

js
        let atxferTransferSeat = document.querySelector('.atxferTransferSeat');
        let atxferTransferSeatBtn = document.querySelector('.atxferTransferSeatBtn');
        atxferTransferSeatBtn.addEventListener('click', function () {
            let data = {
                type: 'dky_atxferTransferSeat',
                number: atxferTransferSeat.value
            }
            console.log('咨询转接');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_atxferTransferSeat' ，iframe咨询转接接口传参的必传类型
number要咨询转接的座席号

22. 咨询三方 ​

js
        let atxferThree = document.querySelector('.atxferThree');
        let atxferThreeBtn = document.querySelector('.atxferThreeBtn');
        atxferThreeBtn.addEventListener('click', function () {
            let data = {
                type: 'dky_atxferThree',
                number: atxferThree.value,
                agentId: agentNumber.value,
            }
            console.log('咨询三方');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_atxferThree' ，iframe咨询三方接口传参的必传类型
number要咨询转接的座席号
agentId当前登陆的座席号

23. 取消咨询 ​

js
    let atxferHunupBtn = document.querySelector('.atxferHunupBtn');
        atxferHunupBtn.addEventListener('click', function () {
            let data = {
                type: 'dky_atxferHunup'
            }
            console.log('取消咨询');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_atxferHunup' ，iframe取消咨询接口传参的必传类型

24. 咨询接回 ​

js
           let atxferHunupBtnBack = document.querySelector('.atxferHunupBtnBack');
           atxferHunupBtnBack.addEventListener('click', function () {
            let data = {
                type: 'dky_atxferHunup'
            }
            console.log('咨询接回');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

data对象介绍（参数都必传）

参数名称描述
type取值'dky_atxferHunup' ，iframe咨询接回接口传参的必传类型

二、接收类型介绍 ​

type描述类型
dk-submitLoginService登陆初始化获取的事件
dk-logoff退出/注销的事件
dk-hangup挂断事件
dk-callphone发起外呼事件
dk-agentState座席状态改变事件
dk-ring响铃事件
dk-answer接听事件
dk-agentMute座席静音事件
dk-hold呼叫保持事件
dk-serviceLevel手动满意度事件
dk-squeeze被挤下线事件
dk-networkDisconnected网络断开事件
dk-networkConnected网路恢复事件
dk-incomingNotConnectedHangup呼入非接通挂断置忙事件
dk-meet咨询三方发起事件
dk-atxfer咨询转接发起事件
dk-reconnect断线重连事件
dk-blindMove转接发起事件
dk-forceOffline强制下线事件

html代码示例

html
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        iframe {
            width: 100%;
            height: 1000px;
            margin-top: 20px;
        }
    </style>
</head>

<body>
    <div>测试iframe</div>
    <input type="text" class="projectId" placeholder="部门编号">
    <input type="text" class="token" placeholder="token">
    <input type="text" class="agentNumber" placeholder="座席工号">
    <input type="text" class="extensionPassword" placeholder="座席密码">
    <input type="text" class="initType" placeholder="分机类型(1:sip话机,2:webrtc分机,3:手机号,)">
    <input type="text" class="extensionNumber" placeholder="绑定号码">
    <input type="text" class="initialState" placeholder="初始状态(2:空闲,3:置忙)">
    <button class="login">登录</button>
    <button class="exit">退出</button>
    <button class="exitUnbind">退出解绑</button>
    <br />
    <input type="text" class="phoneNumber" placeholder="呼叫号码">
    <button class="outCall">呼叫</button>
    <button class="unoutCall">取消外呼</button>
    <button class="hangup">挂断</button>
    <button class="reject">拒接</button>
    <button class="satisfaction">满意度</button>
    <button class="mute">静音</button>
    <button class="unmute">取消静音</button>
    <button class="hold">保持</button>
    <button class="unhold">取消保持</button>
    <button class="idle">空闲</button>
    <button class="busy">置忙</button>
    <button class="answer">接听</button>
    <br>
    <input type="text" class="BindPhone" placeholder="盲转外线号码">
    <button class="BindPhoneBtn">盲转外线</button>
    <input type="text" class="BindSeat" placeholder="盲转座席">
    <button class="BindSeatBtn">盲转座席</button>
    <input type="text" class="NavBindIvrId" placeholder="导航ivrid">
    <input type="text" class="BindIvrId" placeholder="ivrId">
    <input type="text" class="BindNodeType" placeholder="ivrNodeType">
    <button class="BindIvrIdBtn">盲转ivr</button>
    <input type="text" class="BindQue" placeholder="盲转队列座席">
    <button class="BindQueBtn">盲转队列</button>
    <input type="text" class="atxferSeat" placeholder="咨询座席">
    <button class="atxferSeatBtn">咨询</button>
    <input type="text" class="atxferTransferSeat" placeholder="咨询转接座席">
    <button class="atxferTransferSeatBtn">咨询转接</button>
    <input type="text" class="atxferThree" placeholder="咨询三方在线座席">
    <button class="atxferThreeBtn">咨询三方</button>
    <button class="atxferHunupBtn">取消咨询</button>
    <button class="atxferHunupBtnBack">咨询接回</button>
    <iframe ref="iframes" allow='microphone;camera;' class="iframebox" src="https://192.168.1.53:8091/"></iframe>

    <script>
        //登陆参数
        let projectId = document.querySelector('.projectId').value = '20020001001'
        let token = document.querySelector('.token').value = 'D343FCD9177CF56F35128593ECEE5F00'
        let agentNumber = document.querySelector('.agentNumber')
        let extensionPassword = document.querySelector('.extensionPassword').value = '123456'
        let initType = document.querySelector('.initType')
        let extensionNumber = document.querySelector('.extensionNumber')
        let initialState = document.querySelector('.initialState').value = 2
        let phoneNumber = document.querySelector('.phoneNumber')
        let iframebox = document.querySelector('.iframebox')


        //登陆
        let login = document.querySelector('.login')
        login.addEventListener('click', function () {
            let data = {
                type: 'dk_submitLogin',
                projectId: projectId,
                token: token,
                agentNumber: agentNumber.value,
                extensionPassword: extensionPassword,
                initType: initType.value,
                extensionNumber: extensionNumber.value,
                initialState: initialState,
            }
            console.log('登陆', data);
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //退出
        let exit = document.querySelector('.exit')
        exit.addEventListener('click', function () {
            let data = {
                type: 'dky_exitLogin'
            }
            console.log('退出');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //退出解绑
        let exitUnbind = document.querySelector('.exitUnbind')
        exitUnbind.addEventListener('click', function () {
            let data = {
                type: 'dky_exitUnbind'
            }
            console.log('退出解绑');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //呼叫
        let outCall = document.querySelector('.outCall')
        outCall.addEventListener('click', function () {
            let data = {
                type: 'dky_outCall',
                phoneNumber: phoneNumber.value
            }
            console.log('外呼');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //取消外呼
        let unoutCall = document.querySelector('.unoutCall')
        unoutCall.addEventListener('click', function () {
            let data = {
                type: 'dky_hangup'
            }
            console.log('取消外呼');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //挂断
        let hangup = document.querySelector('.hangup')
        hangup.addEventListener('click', function () {
            let data = {
                type: 'dky_hangup'
            }
            console.log('挂断');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //拒接
        let reject = document.querySelector('.reject')
        reject.addEventListener('click', function () {
            let data = {
                type: 'dky_reject'
            }
            console.log('拒接');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

        //拒接
        let satisfaction = document.querySelector('.satisfaction')
        satisfaction.addEventListener('click', function () {
            let data = {
                type: 'dky_satisfaction'
            }
            console.log('满意度');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //静音
        let mute = document.querySelector('.mute')
        mute.addEventListener('click', function () {
            let data = {
                type: 'dky_mute'
            }
            console.log('静音');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //取消静音
        let unmute = document.querySelector('.unmute')
        unmute.addEventListener('click', function () {
            let data = {
                type: 'dky_unmute'
            }
            console.log('取消静音');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //保持
        let hold = document.querySelector('.hold')
        hold.addEventListener('click', function () {
            let data = {
                type: 'dky_hold'
            }
            console.log('保持');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //取消保持
        let unhold = document.querySelector('.unhold')
        unhold.addEventListener('click', function () {
            let data = {
                type: 'dky_unhold'
            }
            console.log('取消保持');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //空闲
        let idle = document.querySelector('.idle')
        idle.addEventListener('click', function () {
            let data = {
                type: 'dky_idle'
            }
            console.log('空闲');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //置忙
        let busy = document.querySelector('.busy')
        busy.addEventListener('click', function () {
            let data = {
                type: 'dky_busy'
            }
            console.log('置忙');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //接听
        let answer = document.querySelector('.answer')
        answer.addEventListener('click', function () {
            let data = {
                type: 'dky_answer'
            }
            console.log('接听');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //盲转外线
        let BindPhone = document.querySelector('.BindPhone');
        let BindPhoneBtn = document.querySelector('.BindPhoneBtn');
        BindPhoneBtn.addEventListener('click', function () {
            console.log(BindPhone.value);
            let data = {
                type: 'dky_bindPhone',
                number: BindPhone.value
            }
            console.log('盲转外线');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //盲转座席
        let BindSeat = document.querySelector('.BindSeat');
        let BindSeatBtn = document.querySelector('.BindSeatBtn');
        BindSeatBtn.addEventListener('click', function () {
            console.log(BindSeat.value, '看看这是什么');
            let data = {
                type: 'dky_bindSeat',
                number: BindSeat.value
            }
            console.log('盲转座席');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //盲转ivr
        let NavBindIvrId = document.querySelector('.NavBindIvrId');
        let BindIvrId = document.querySelector('.BindIvrId');
        let BindNodeType = document.querySelector('.BindNodeType');
        let BindIvrIdBtn = document.querySelector('.BindIvrIdBtn');
        BindIvrIdBtn.addEventListener('click', function () {
            let data = {
                type: 'dky_bindIvr',
                data: {
                    NavBindIvrId: NavBindIvrId.value,
                    BindIvrId: BindIvrId.value,
                    BindNodeType: BindNodeType.value
                }
            }
            console.log('盲转ivr');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //盲转队列
        let BindQue = document.querySelector('.BindQue');
        let BindQueBtn = document.querySelector('.BindQueBtn');
        BindQueBtn.addEventListener('click', function () {
            let data = {
                type: 'dky_bindQue',
                number: BindQue.value
            }
            console.log('盲转队列');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //咨询
        let atxferSeat = document.querySelector('.atxferSeat');
        let atxferSeatBtn = document.querySelector('.atxferSeatBtn');
        atxferSeatBtn.addEventListener('click', function () {
            let data = {
                type: 'dky_atxferSeat',
                number: atxferSeat.value
            }
            console.log('咨询');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //咨询转接
        let atxferTransferSeat = document.querySelector('.atxferTransferSeat');
        let atxferTransferSeatBtn = document.querySelector('.atxferTransferSeatBtn');
        atxferTransferSeatBtn.addEventListener('click', function () {
            let data = {
                type: 'dky_atxferTransferSeat',
                number: atxferTransferSeat.value
            }
            console.log('咨询转接');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })



        //咨询三方
        let atxferThree = document.querySelector('.atxferThree');
        let atxferThreeBtn = document.querySelector('.atxferThreeBtn');
        atxferThreeBtn.addEventListener('click', function () {
            let data = {
                type: 'dky_atxferThree',
                number: atxferThree.value,
                agentId: agentNumber.value,
            }
            console.log('咨询三方');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //取消咨询
        let atxferHunupBtn = document.querySelector('.atxferHunupBtn');
        atxferHunupBtn.addEventListener('click', function () {
            let data = {
                type: 'dky_atxferHunup'
            }
            console.log('取消咨询');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })


        //咨询接回
        let atxferHunupBtnBack = document.querySelector('.atxferHunupBtnBack');
        atxferHunupBtnBack.addEventListener('click', function () {
            let data = {
                type: 'dky_atxferHunup'
            }
            console.log('咨询接回');
            iframebox.contentWindow.postMessage(data, 'https://192.168.1.53:8091/')
        })

        // // 监听子窗口发送的消息
        // window.addEventListener('message', function (event) {
        //     // 处理接收到的消息
        //     var message = event.data;
        //     console.log('本页面接接受到的消息', message);
        //     switch (e.data.type) {

        //     }
        // });
        window.addEventListener('message', (e) => {
            // e.data为子页面发送的数据
            console.log(e.data);
            switch (e.data.type) {
                case 'dk-submitLoginService':
                    console.log(e.data.data, 'iframe---登陆初始化接收的数据');
                    break;
                case 'dk-logoff':
                    console.log(e.data.data, 'iframe---退出/注销的事件');
                    break;
                case 'dk-hangup':
                    console.log(e.data.data, 'iframe---挂断事件');
                    break;
                case 'dk-callphone':
                    console.log(e.data.data, 'iframe---外呼操作事件');
                    break;
                case 'dk-agentState':
                    console.log(e.data.data, 'iframe---座席状态事件');
                    break;
                case 'dk-agentRing':
                    console.log(e.data.data, 'iframe---分机的响铃事件');
                    break;
                case 'dk-agentAnswer':
                    console.log(e.data.data, 'iframe---分机的接听事件');
                    break;
                case 'dk-callEnd':
                    console.log(e.data.data, 'iframe---分机的挂断事件');
                    break;
                case 'dk-ring':
                    console.log(e.data.data, 'iframe---响铃事件');
                    break;
                case 'dk-answer':
                    console.log(e.data.data, 'iframe---接听事件');
                    break;
                case 'dk-agentMute':
                    console.log(e.data.data, 'iframe---座席静音事件');
                    break;
                case 'dk-hold':
                    console.log(e.data.data, 'iframe---呼叫保持的事件');
                    break;
                case 'dk-serviceLevel':
                    console.log(e.data.data, 'iframe---满意度事件');
                    break;
                case 'dk-squeeze':
                    console.log(e.data.data, 'iframe---被挤下线事件');
                    break;
                case 'dk-networkDisconnected':
                    console.log(e.data.data, 'iframe---网络断开事件');
                    break;
                case 'dk-networkConnected':
                    console.log(e.data.data, 'iframe---网络连接恢复事件');
                    break;
                case 'dk-incomingNotConnectedHangup':
                    console.log(e.data.data, 'iframe---呼入非接通挂断置忙事件');
                    break;
                case 'dk-meet':
                    console.log(e.data.data, 'iframe---咨询三方发起事件');
                    break;
                case 'dk-atxfer':
                    console.log(e.data.data, 'iframe---咨询转接发起事件');
                    break;
                case 'dk-consult':
                    console.log(e.data.data, 'iframe---咨询发起事件');
                    break;
                case 'dk-reconnect':
                    console.log(e.data.data, 'iframe---断线重连事件');
                    break;
                case 'dk-blindMove':
                    console.log(e.data.data, 'iframe---转接发起事件');
                    break;
                case 'dk-forceOffline':
                    console.log(e.data.data, 'iframe---强制下线事件');
                    break;
            }
        });
    </script>
</body>

</html>

子窗口 ​

发送相应的事件数据 ​

代码示例

vue
const fn =()=>{
......
 dky.on('dky:answer', (data) => {
    // 接听事件iframe发送
    var Iframedata = {
      type: 'dk-answer',
      data: data
    }
    window.parent.postMessage(Iframedata, '*');
 });
......
}

接受相应的事件数据 ​

vue
const fn =()=>{
//iframe接收弹屏事件
window.addEventListener('message', (e) => {
  // e.data为父页面发送的数据
  switch (e.data.type) {
    ......
    case 'dky_outCall':
      //外呼
      let data = {
        callednum: e.data.phoneNumber
      }
      phoneValue.value = ruleForm.callphone = e.data.phoneNumber
      dky.callphone(data)
      break;
    ......
  });
}

版权所有©2018-2024 点控云（北京）智能科技有限公司