如何从跨域HTTP请求获取特定内容 [英] How to get specific content from cross-domain http request

问题描述

有一个荷兰新闻网站，网址为: nu.nl 我对获得位于她上方的第一个网址标题很感兴趣:

There is a Dutch news website at: nu.nl I am very interested in getting the first url headline which is resided over her:

<h3 class="hdtitle">
          <a style="" onclick="NU.AT.internalLink(this, event);" xtclib="position1_article_1" href="/buitenland/2880252/griekse-hotels-ontruimd-bosbranden.html">
            Griekse hotels ontruimd om bosbranden            <img src="/images/i18n/nl/slideshow/bt_fotograaf.png" class="vidlinkicon" alt="">          </a>
        </h3> 

所以我的问题是如何获取该URL?我可以用Jquery做到这一点吗?我认为不会，因为它不在我的服务器上.因此，也许我将不得不使用PHP?我从哪里开始...?

So my question is how do I get this url? Can I do this with Jquery? I would think not because it is not on my server. So maybe I would have to use PHP? Where do I start...?

推荐答案

经测试可正常工作

由于 http://www.nu.nl 不是您的网站，因此可以执行 跨域 GET使用PHP代理方法，否则会出现这种错误:

Tested and working

Because http://www.nu.nl is not your site, you can do a cross-domain GET using the PHP proxy method, otherwise you will get this kind of error:

XMLHttpRequest无法加载 http://www.nu.nl/.起源 Access Control-Allow-Origin不允许 http://yourdomain.com .

XMLHttpRequest cannot load http://www.nu.nl/. Origin http://yourdomain.com is not allowed by Access-Control-Allow-Origin.

首先在服务器的 PHP 端使用此文件:

First of all use this file in your server at PHP side:

proxy.php(已更新)

<?php
if(isset($_GET['site'])){
  $f = fopen($_GET['site'], 'r');
  $html = '';
  while (!feof($f)) {
    $html .= fread($f, 24000);
  }
  fclose($f);
  echo $html;
}
?>

现在，在JavaScript端使用 jQuery ，您可以执行以下操作:

Now, at javascript side using jQuery you can do the following:

(只是知道我正在使用prop();，因为我使用的是jQuery 1.7.2 版本.因此，如果您使用的是 1.6.x 之前的版本>，请尝试使用attr();)

(Just to know I am using prop(); cause I use jQuery 1.7.2 version. So, if you are using a version before 1.6.x, try attr(); instead)

$(function(){

   var site = 'http://www.nu.nl';

   $.get('proxy.php', { site:site }, function(data){

      var href = $(data).find('.hdtitle').first().children(':first-child').prop('href');
      var url = href.split('/');
      href = href.replace(url[2], 'nu.nl');

      // Put the 'href' inside your div as a link
      $('#myDiv').html('<a href="' + href + '" target="_blank">' + href + '</a>');

   }, 'html');

});

如您所见，请求在您的域中，但是有点棘手，因此您不会再收到Access-Control-Allow-Origin错误！

As you can see, the request is in your domain but is a kind of tricky thing so you won't get the Access-Control-Allow-Origin error again!

如果您希望获得注释中写的所有标题href，则可以执行以下操作:

If you want to get all headlines href as you wrote in comments, you can do the following:

只需更改这样的jQuery代码...

Just change jQuery code like this...

$(function(){

   var site = 'http://www.nu.nl';

   $.get('proxy.php', { site:site }, function(data){

        // get all html headlines
        headlines = $(data).find('.hdtitle');

        // get 'href' attribute of each headline and put it inside div
        headlines.map(function(elem, index){ 
            href = $(this).children(':first-child').prop('href');
            url = href.split('/');
            href = href.replace(url[2], 'nu.nl');
            $('#myDiv').append('<a href="' + href + '" target="_blank">' + href + '</a><br/>');
        });

   }, 'html');

});

，并使用更新的proxy.php文件(在两种情况下均为1个或所有标题).

and use updated proxy.php file (for both cases, 1 or all headlines).

希望这会有所帮助:-)

Hope this helps :-)

这篇关于如何从跨域HTTP请求获取特定内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！