Problem with AJAX and PHP!_问答_开发者_运维开发者技术经验分享

I have a PHP page that will collect mp3 links from downloads.nl. The result is converted to XML and renders fine.

The problem occurs when I try to read that XML using ajax. The files are on the same domain and it's really confusing me. This is my php crawler.

    <?php
header("Content-type: text/xml");
$artistname = $_GET['artistname'];
$trackname = $_GET['trackname'];
$newartistname = str_replace(" ","+",$artistname);
$newtrackname = str_replace(" ","+",$trackname);
$target_url = "http://www.downloads.nl/results/mp3/1/".$newartistname."+".$newtrackname;
$userAgent = 'Googlebot/2.1 (http://www.googlebot.com/bot.html)';
error_reporting(0);

// make the cURL request to $target_url
$ch = curl_init();
curl_setopt($ch, CURLOPT_USERAGENT, $userAgent);
curl_setopt($ch, CURLOPT_URL,$target_url);
curl_setopt($ch, CURLOPT_FAILONERROR, true);
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, true);
curl_setopt($ch, CURLOPT_AUTOREFERER, true);
curl_setopt($ch, CURLOPT_RETURNTRANSFER,true);
curl_setopt($ch, CURLOPT_TIMEOUT, 10);
$html= curl_exec($ch);
if (!$html) {
    echo "<br />cURL error number:" .curl_errno($ch);
    echo "<br />cURL error:" . curl_error($ch);
    exit;
}

// parse the html into a DOMDocument
$dom = new DOMDocument();
@$dom->loadHTML($html);

// grab all the on the page
$xpath = new DOMXPath($dom);
$hrefs = $xpath->evaluate("/html/body//a");
echo '<?xml version="1.0"?>';
echo '<downloads>';
echo '<trackname>'.$newartistname."+".$newtrackname.'</trackname>';
for ($i = 0; $i < $hrefs->length; $i++) {
    $href = $hrefs->item($i);
    $url = $href->getAttribute('href');
        if(strpos($url, ".cgi")){
            echo '<link>http://downloads.nl'.htmlspecialchars($url,ENT_QUOTES).'</link>';
          }
}
echo '</downloads>';
?>

and here is my javascript function

 function getDownloadLink(artistname,trackname){
        var xmlhttp4;
        if (window.XMLHttpRequest){
            xmlhttp4 = new XMLHttpRequest();
        }
        else{
            xmlhttp4 = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp4.onreadystatechange=function(){
            alert(xmlhttp4.readyState);
            if (xmlhttp4.readyState==4 && xmlhttp4.status==200){
                try{
                    var downloadlink = xmlhttp4.responseXML.documentElement.getElementsByTagName("downloads");
                    for (var i=0;i<downloadlink.length;i++){
                        al开发者_如何学Cert(i);
                    }
                }
                catch(er){
                    alert(xmlhttp4.responseText);
                }
            }
            else{
                alert("ReadyState: "+xmlhttp4.readyState+" Status: "+xmlhttp4.status);
            }
        }
        xmlhttp4.open("GET","http://localhost/bone/searchmusic.php?artistname="+artistname+"&trackname="+trackname,true);
        xmlhttp4.send(null);
    }

I have no idea what the problem is. Am I not rendering the XML correctly or is my ajax lacking?

Thanks,

Sam

The following page, using the jQuery JavaScript framework, is working for me…

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>Test</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function(){
            $('.getMp3').click(function() {
                var artist = $('.artist', this).text();
                var track = $('.track', this).text();
                getDownloadLink(artist, track);
            });

            function getDownloadLink(artist, track) {
                $.ajax({
                    url:'downloads.xml',
                    dataType:'xml',
                    success: function(xml) {
                        $(xml).find('link').each(function() {
                            $('#results').append('<li><a href="'+$(this).text()+'">track</a></li>');
                        });
                    }
                });
            }
        });
    </script>
</head>
<body>
<p>
    <a href="#" class="getMp3">Get <span class="artist">Lady GaGa</span> - <span class="track">Bad Romance</span> tracks</a>
</p>
<ul id="results"></ul>
</body>
</html>

…given that you have a file called downloads.xml file in the following format:

<?xml version="1.0"?>
<downloads>
  <trackname>LadyGaga+BadRomance</trackname>
  <link>a</link>
  <link>b</link>
  <link>c</link>
  <link>d</link>
</downloads>

This code doesn't actually use the artist and track but I added them to give you an idea of how it might work.

Thanks for you solution Andyb. It works like a charm now. I had a look at jQuery Ajax before but never thought it wasn't powerful enough. Here is the code that I'm using right now.

    function getDownloadLink(artist, track) {
        $.ajax({
            url:'http://localhost/bone/searchmusic.php?artistname='+artist+'&trackname='+track,
            dataType:'xml',
            success: function(xml) {
                $(xml).find('link').each(function() {
                    $('#download').append('<li><a href="'+$(this).text()+'">track</a></li>');
                    });
                }
            });
        }
</script>

Thanks again.