【问题标题】:js: Load html of a page from a different domainjs:从不同的域加载页面的 html
【发布时间】:2013-06-01 14:58:55
【问题描述】:

我想知道如何加载托管在不同域上的 HTML?

我正在使用 JavaScript,并想创建一个书签,使我能够解析外部 HTML。

我已经徒劳地搜索了几个小时......

【问题讨论】:

    标签: javascript cross-domain bookmarklet


    【解决方案1】:

    JavaScript 不允许进行跨域请求。这是一个很大的安全风险。相反,您必须在服务器上执行一个脚本并将结果返回给您的 JavaScript 函数。

    例如,假设您使用 JavaScript 和 PHP,您可以将应用程序设置为如下所示:

    JavaScript 向位于您服务器上的页面(或脚本)发起 Ajax 请求。它将任何必需的参数传递到此页面。以下代码基于jQuery(为了简洁起见),但无论您的框架如何,原理都是相同的。

    var sParameters = " ... " // this is defined by you
    $.ajax({
      url: 'your-server-side-code.php',
      processData: false,
      data: sParameters,
      success: function(sResponse) {
        // handle the response data however you want
      }
    });
    

    服务器端代码将响应请求并将必要的参数传递给跨域网站。 PHP 的cURL library 对此很有用。

    // very contrivuted cURL configuration for purposes of example...
    $curl_connection = curl_init();
    $str_url = "http://you-url.com";
    curl_setopt($curl_connection, CURLOPT_URL, $str_url);
    curl_setopt($curl_connection, CURLOPT_GET, 1);
    // ... keep setting your options ...
    $str_response = curl_exec($curl_connection);
    curl_close($curl_connection);
    

    当跨域网站响应时,您的服务器端代码可以将响应回显到初始请求。这可能应该在回复之前进行验证,但这只是一个示例。

    print_r($str_response);
    

    然后,JavaScript 响应处理函数可以解析传入的响应数据。请注意上面第一段 JavaScript 代码中的成功函数。

    【讨论】:

    • 请注意,当页面无法从服务器访问时,这会很痛苦。
    • 恐怕我没有启用 curl 的服务器。
    【解决方案2】:

    如果您不拥有其他页面,那将非常困难。

    事实上,您不能在 javascript 中向另一个域发出请求。您唯一能做的就是从另一个域加载脚本:

    <script type="text/javascript" src="http://otherdomain.com/script.js"></script>
    

    如果这样做的目的是从其他域加载数据,并且(如我所说)您拥有其他站点,则可以创建 script.js 文件,它将加载您在原始站点中需要的数据。

    请记住,这是一件微妙的事情,只有在您知道脚本中有什么内容时才应该这样做。

    【讨论】:

      【解决方案3】:

      您可以从localhost 发出跨域请求,但如果您打算将此代码部署到服务器,它就无法工作。由于您正在开发一个书签,我认为您可以这样做。

      您需要使用 AJAX 来获取远程 HTML。

      jQuery 库让这项任务变得如此简单......

      $.get("http://www.google.com", function(html) { alert(html); });
      

      【讨论】:

      • 谢谢,但只有当我在访问 google.com 时运行小书签时它才有效
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-11-06
      • 1970-01-01
      • 2011-02-06
      相关资源
      最近更新 更多