SharedWorker
最近公司需要在Qt內(nèi)的各個(gè)iframe進(jìn)行通信携御,但考慮到Qt的webChanel通信性能搂抒,需要考慮其它通信方式姑宽。于是找到了SharedWorker寇漫。
SharedWorker 是一種特殊的 WebWorker刊殉,可有支持多個(gè)瀏覽器上下文的通信功能,例如多個(gè)窗口猪腕、iframe。
:snake: 注意:如果要使 SharedWorker 連接到多個(gè)不同的頁面钦勘,這些頁面必須是同源的(相同的協(xié)議陋葡、host 以及端口)。
一彻采、兼容性
可以看出它在Chrome中的兼容性是非常優(yōu)秀的腐缤,而Qt的內(nèi)核正是 chrome
image.png
二捌归、使用
SharedWorker 需要提供一個(gè)js靜態(tài)資源文件。該文件用于讓各個(gè)頁簽項(xiàng)目加載 岭粤。
var clients = [];
onconnect = function(e) {
var port = e.ports[0];
clients.push(port);
port.addEventListener("message", function(e) {
for (var i = 0; i < clients.length; i++) {
var eElement = clients[i];
eElement.postMessage(e.data);
}
});
port.start();
};
然后使用 ShareWorker 構(gòu)造函數(shù)加載這個(gè)腳本 惜索,并添加相關(guān)事件進(jìn)行監(jiān)聽
this.shareWorker = new SharedWorker("https://www.xxxx.com/static/lib/worker.js");
// 接受信息
this.shareWorker.port.onmessage = (e)=> {
console.log(e.data)
}
// 發(fā)送信息
this.shareWorker.port.postMessage({
type : 'notifyTab',
payload : {}
});
:snake: 使用
postMessage
時(shí),所有接入了shareWorker的頁簽都能收到該消息剃浇,包括自己