postmassage用法
1、主页面
allow="camera *; microphone *"作用是开放音频权限
<template>
<section class="basic_data">
<iframe
class="iframeRef"
ref="iframeRef"
allowfullscreen
security="restricted"
allow="camera *; microphone *"
></iframe>
<button @click="registerFun">测试呼叫</button>
</section>
</template>
<script src='./index.js'>
</script>
<style lang='less' scoped src='./index.less'>
</style>
export default {
components: {
buttons
},
props: {},
data() {
return {
};
},
computed: {},
watch: {
},
created() {},
mounted() {
this.$nextTick(() => {
let res = this.$refs.iframeRef.contentWindow.location = "https://192.168.0.201:8081/#/home"
this.registerFun();
})
},
methods: {
//methods start
/**
* 注册参数
*/
registerFun() {
let res = this.$refs.iframeRef.contentWindow;
let dom = this.$refs.iframeRef;
let data={
register: {//第一次打开页面参数
username: "thkj_cs1",
password: "123456"
},
// logout: {//重新登录参数
// username: "thkj_cs1",
// password: "123456"
// }
}
dom.onload=()=>{
res.postMessage(data, "*")
}
},
/**
* 外面一键外呼
*/
callInFun(){
let res = this.$refs.iframeRef.contentWindow;
let data={
phone:""
}
res.postMessage(data, "*")
}
//methods end
},
}
2、远程页面监听方法
window.addEventListener("message", (e) => {
console.log(123,e);
}, false);