apf*_*pfz 0 forms iframe jquery browser-plugin same-origin-policy
对于我的公司,我想将存储在数据库中的表单中的值映射到第三方公司的形式(我们日常工作的一部分).
我们的表格在site1.com上,第三方公司的表格在site2.com上,并在site1.com上的iframe中显示.
我完全控制site1.com,没有通过site2.com
显然,使用jQuery,由于同源策略,映射将不起作用.
我想,既然我可以使用"inspect element"手动操作DOM树,那么浏览器插件可能会起作用.但是直到现在我还没有能够使这个工作,因为我再次遇到同源策略.
有没有其他方法让这个工作？我是否需要更进一步并为我的Mac创建一个可可应用程序？
您可以使用用户脚本来实现目标.我做了一个sitele.com考试 - 一个有输入,按钮,iframe的页面(看看sitetwo.com).在按钮上单击来自siteone.com的输入值,显示在sitetwo.com的输入中.要安装用户脚本,您可以使用浏览器扩展程序Tampermonkey for Chrome和Safari,或Greasemonkey for Firefox.对于页面和iframe之间的通信,我使用了Window.postMessage外观文档.如果您需要javascript库,可以使用@require元块链接.
siteone.com index.html
<html>
<head>
</head>
<body>
<input id="parent-input" type="text"/>
<button id="send-data-to-iframe">Send data to iframe</button>
<br /><br />
<iframe id="my-iframe" style="border:1px solid red; height:50px; width:200px;" src="http://sitetwo.com:8080">
</iframe>
<script>
var win = document.getElementById("my-iframe").contentWindow;
document.getElementById("send-data-to-iframe").onclick = function(){
win.postMessage(
document.getElementById("parent-input").value,
"http://sitetwo.com:8080" // target domain
);
return false;
}
</script>
</body>
sitetwo.com index.html
<html>
<head>
</head>
<body>
<input id="iframe-input" type="text"/>
</body>
myUserJS.user.js
// ==UserScript==
// @name myUserJS
// @license MIT
// @version 1.0
// @include http://sitetwo.com*
// ==/UserScript==
(function (window, undefined) {
var w;
if (typeof unsafeWindow != undefined) {
w = unsafeWindow
} else {
w = window;
}
// extended check, sometimes @include section is ignored
if (/http:\/\/sitetwo.com/.test(w.location.href)) {
function listener(event){
document.getElementById("iframe-input").value = event.origin + " send: " + event.data;
}
if (w.addEventListener){
w.addEventListener("message", listener,false);
} else {
w.attachEvent("onmessage", listener);
}
}
})(window);