-1

我需要在 iframe 中加载几个网站，同时在每个页面中添加一个谷歌翻译插件，以便可以翻译它们。这是我插入部分的代码：

<iframe onload="googleJS1(); googleJS2(); googleJS3();" class=iframe2 src=http://localhost:8888/mysitep></iframe>

<script>
    function googleJS1() {
        var iframe = document.getElementsByTagName('iframe')[0];
        var doc = iframe.contentWindow.document;
        var newScript = doc.createElement('div');
        newScript.setAttribute("id", "google_translate_element");
        var bodyClass = doc.getElementsByTagName('body')[0];
        bodyClass.insertBefore(newScript, bodyClass.childNodes[0]);
    }

    function googleJS2() {
        var iframe = document.getElementsByTagName('iframe')[0];
        var doc = iframe.contentWindow.document;
        var newScript = doc.createElement('script');
        newScript.setAttribute("src", "http://translate.google.com/translate_a/element.js?    cb=googleTranslateElementInit");
        var bodyClass = doc.getElementsByTagName('head')[0];
        bodyClass.insertBefore(newScript, bodyClass.childNodes[1]);
    }

    function googleJS3() {
        var iframe = document.getElementsByTagName('iframe')[0];
        var doc = iframe.contentWindow.document;
        var newScript = doc.createElement('script');
        newScript.setAttribute("src", "http://localhost:8888/mysite/google.js");
        var bodyClass = doc.getElementsByTagName('head')[0];
        bodyClass.insertBefore(newScript, bodyClass.childNodes[2]);
    }
}
</script>

只要 iframe 目标 URL 位于同一服务器上，此方法就可以工作。我阅读以绕过相同的来源约束，我应该设置代理服务器并通过代理传递所有 URL 请求。所以我阅读了 cURL 并尝试了这个作为测试：

<?php

function get_data($url) {
    $ch = curl_init();
    $timeout = 5;
    curl_setopt($ch,CURLOPT_USERAGENT, $userAgent);
        curl_setopt($ch,CURLOPT_URL,$url);
    curl_setopt($ch,CURLOPT_RETURNTRANSFER,1);
    curl_setopt($ch,CURLOPT_CONNECTTIMEOUT,$timeout);
    curl_setopt($ch,CURLOPT_FOLLOWLOCATION,true);
    $data = curl_exec($ch);
    curl_close($ch);
    return $data;
}

$test = get_data("http://www.selfridges.com");
echo $test;

?>

加载了基本的 HTML 元素，但没有加载 CSS 和图像。此外，链接仍然指向原始 URL。我需要一些关于如何将 CSS、图像和 js 从目标 URL 拉到代理并从那里加载页面的建议，使其看起来像是来自相同的域和端口并通过相同的源策略。我还需要链接以这种方式工作。

例如：

main page - http://localhost:8888/proxy.php 

links     - http://localhost:8888/proxy.php/products/2012/shoes

也欢迎任何其他方法或替代方案。

谢谢

4

1 回答 1

1

假设目标文档中的所有链接和图像都是相对的，您可以将base标签注入头部。这将有效地使链接成为绝对链接，因此链接和图像仍将引用目标域（而不是您的域）。

http://reference.sitepoint.com/html/base

不过，不确定这将如何与 css 图像一起使用。

一个对任何目标站点都有效的解决方案将很难——您不仅需要解析 html 中的链接，还需要解析任何 css 引用中的链接。一些站点可能使用 AJAX 来填充页面，这也会在目标站点上导致同源策略问题。

于 2013-01-19T21:47:57.217 回答