提问人：Rajkumar B 提问时间：10/14/2023 最后编辑：Rajkumar B 更新时间：10/23/2023 访问量：143
广播频道 API 通信在 servicenow 中不起作用，iframe 和子窗口从 chrome 浏览器中具有相同来源的 iframe 打开
Broadcast Channel API communication is not working inside servicenow iframe and child window opened from iframe with same origin in chrome browser
问：
我们创建了一个包含 2 页broadcast.html和receiver.html的 Web 应用程序。Broadcast.html使用 OpenFrame Widget 在 ServiceNow CRM 中添加为 iframe，receiver.html 与 broadcast.html 分开打开。我们尝试使用广播 api 在 2 个页面之间进行通信，并且在 servicenow 中打开时它在 chrome 浏览器中不起作用，但如果 servicenow 中没有加载broadcast.html则通信正常工作。
代码附在下面
Openframe 小部件代码
<html>
<body style="padding-top: 0rem;">
<iframe id="softphone" style="width: 100%; height: 100%; position: fixed; border: none;" allow="microphone *" src="https://localhost:9981/broadcast.html" />
</body>
</html>
广播 HTML
<!DOCTYPE html>
<body>
<!-- The title will change to greet the user -->
<h1 id="title">Hey</h1>
<input id="name-field" placeholder="Enter Your Name"/>
</body>
<script>
window.onload=function(){
window.open("/reciever.html?ts=" + new Date().getTime(), "reciever", "fullscreen=no, width=455, height=320, resizable=no, location=no'");
//window.open("reciever.html");
}
var bc = new BroadcastChannel('test_channel');
(()=>{
const title = document.getElementById('title');
const nameField = document.getElementById('name-field');
const setTitle = (userName) => {
title.innerHTML = 'Hey ' + userName;
}
// When the page loads check if the title is in our localStorage
if (localStorage.getItem('title')) {
setTitle(localStorage.getItem('title'));
} else {
setTitle('please tell us your name');
}
nameField.onchange = (e) => {
const inputValue = e.target.value;
// In the localStorage we set title to the user's input
localStorage.setItem('title', inputValue);
// Update the title on the current page
setTitle(inputValue);
// Tell the other pages to update the title
bc.postMessage(inputValue);
}
})()
</script>
</html>
接收器 HTML
<!DOCTYPE html>
<body>
<!-- The title will change to greet the user -->
<h1 id="title">Hey</h1>
</body>
<script>
var bc = new BroadcastChannel('test_channel');
bc.onmessage = (messageEvent) => {
console.log(messageEvent.data);
document.getElementById('title').innerHTML=messageEvent.data;
}
</script>
</html>
答： 暂无答案
评论