通过消息将数据传递给iframe时不会改变原点

假设我有2个页面： foo.com和bar.com 我有一个使用Tapermonkey在其上运行的脚本。我想在foo.com上将脚本传递给bar.com上的脚本。由于foo和bar在不同的域中，我无法直接传递数据（GM_setValue，localStorage，webSQL）。通过消息将数据传递给iframe时不会改变原点

但我发现这个教程： https://jcubic.wordpress.com/2014/06/20/cross-domain-localstorage/

诀窍是用bar.com iframe的连接到foo.com，通过postMessage的和IFRAME发送数据接收数据，并将其保存到localStorage的。然后，foo.com上的第二个脚本将能够从本地存储中读取数据。

这里的第一个剧本：

var name = "John"; 
var div = document.createElement('div'); 
div.id = "result"; 
document.body.appendChild(div); 
var barPage = 'http://bar.com/'; 
document.getElementById("result").innerHTML = "<iframe src='"+ barPage +"' width='100%' height='100px' id='bariframe' />"; 

$(document).ready(function() { 
    var win = div.children[0].contentWindow; 

    var script = "window.addEventListener('message',function(e){if(e.origin!=='http://bar.com/'){console.log('wrong origin: '+e.origin);return}alert(e.data);var payload=JSON.parse(e.data);localStorage.setItem(payload.key,JSON.stringify(payload.data))});"; 

    var scriptObj = win.document.createElement("script"); 
    scriptObj.type = "text/javascript"; 
    scriptObj.id = "barscript"; 
    scriptObj.innerHTML = script; 
    win.document.body.appendChild(scriptObj);   

    var obj = { 
     "name": name 
    }; 
    var json = JSON.stringify({key: 'storage', data: obj}); 
    win.postMessage(json, "*"); 
    console.log("Sent: " + json); 
});

什么脚本执行：

1）创建空的div并将其添加在foo.com

2）文件就装在我的底部将javascript注入iframe并通过postMessage向其发送数据

3）注入脚本应接收数据并将其保存到localStorage。

但问题是我仍然在该脚本中获得foo.com起源。它应该是bar.com，不是吗？

因此，当我真的打开foo.com脚本在这里不会有这个数据。

它为什么不起作用？

来源

2017-04-13 Makalele

一个HTML页面，但我不是其中任何一个网站的所有者。那么我该怎么做呢？ – Makalele

将数据存储在数据服务或您的服务器上，并请求您的用户脚本 – charlietfl

，如firebase？ – Makalele

由于“同源策略”，您无法访问您正在创建的交叉源iframe中的任何内容。

你需要从bar.com具有postMessage的听众在它使你的方法工作

来源

2017-04-13 13:07:59 charlietfl

通过消息将数据传递给iframe时不会改变原点

回答

相关问题