在postMessage中使用window.origin安全吗？

Question

在使用postMessage时，重要的是定义一个targetOrigin，以确保我们不会将数据泄露给其他站点。

同样重要的是，在收到消息时检查来源，以防止其他站点触发我们的脚本。

但是，如果我们只是希望在我们自己的域上这样做，那么使用：

targetWindow.postMessage({message}, window.origin);

--

window.addEventListener("message", e => {
  if (e.origin == window.origin){
    //Trigger something
  }
});

Answer 1

我不是安全专家，但是MDN recommends to check消息的origin &可能是source属性。所以，检查它是正确的&我们可以认为它是安全的。

现在，问题开始出现了：

根据窗口的origin检查消息的origin有多安全？

首先，考虑有两种方法可以检查窗口的origin。您尝试使用的是WindowOrWorkerGlobalScope.origin，另一个是window.location.origin。

我不会使用WindowOrWorkerGlobalScope.origin，因为它可以在客户端被覆盖。试试看：

window.origin = 'https://www.example.com';
console.log(window.origin === 'https://www.example.com');

我不认为这是一个直接的安全威胁(尽管我不是上面提到的安全专家)，但在某些情况下，它可以很容易地执行一次成功的攻击。

作为额外的好处，它有更广泛的浏览器支持。

因此，我将使用window.location.origin或硬编码网址，如MDN所示。