electron桌面端与加载的webview通信

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/jbguo/article/details/90169137

webview通过postMessage发送消息，并监听消息返回

// webview向桌面端发送消息
let msg = '测试消息';
window.postMessage(
  msg,
  'https://www.csdn.net'
);
let receiveMessage = function (event) {
  if (event.data === msg) return; // 避免在同一窗口时循环调用
  const newMsg = event.data;
  console.log(`收到处理后消息:${newMsg}`);
  // eslint-disable-next-line no-useless-return
  if (event.origin !== currentUrl) return;
};
window.addEventListener('message', receiveMessage, false);

electron端监听webview端发送的消息，进行处理后调用postMessage回传给webview

let currentUrl = 'https://www.csdn.net'';
let receiveMessage = function(event) {
  //简单处理消息
  let newMsg = event.data + new Date().getTime();
  console.log('执行消息处理:' + newMsg);
  if (event.origin !== currentUrl) return;
  event.source.postMessage(newMsg, event.origin);
};

window.addEventListener('message', receiveMessage, false);