使用Phonegap应用程序执行ajax请求的问题

Question

我正在尝试使用Phonegap和jQuery创建一个简单的RSS阅读器。 我正在关注本教程：http://visualrinse.com/2008/09/24/how-to-build-a-simple-rss-reader-with-jquery/。

当我在浏览器中试用代码时，我已经成功实现了这项工作。 php文件提取feed并将其输出，就像我期望的那样。 但是，当我从编译的Phonegap应用程序中运行相同的文件时，ajax-request只返回php文件（php代码，而不是执行结果）的内容。

我花了几个小时搜索这个，并尝试了大量的教程和调整。我在官方的Phonegap论坛上也找不到解决方案。我究竟做错了什么？这个问题似乎是PHP没有回应请求。我试图将php文件移到不同的域，但结果是一样的，它在我的浏览器中工作，但不在编译的应用程序中。

这里是jQuery代码初始化Ajax代码：

function get_rss_feed() { 
    //clear the content in the div for the next feed. 
    $("#feed_content").empty().html('<img class="loader" src="js/images/ajax-loader.gif" alt=""/>'); 

    $.ajax({ 
     url: 'http://192.168.1.7/rssApp/www/rss-proxy.php?url=http://www.nytimes.com/services/xml/rss/nyt/GlobalHome.xml', 
     success: function parseRSS(d) { 

     //find each 'item' in the file and parse it 
     $(d).find('item').each(function() { 

      //name the current found item this for this particular loop run 
      var $item = $(this); 
      // grab the post title 
      var title = $item.find('title').text(); 
      // grab the post's URL 
      var link = $item.find('link').text(); 
      // next, the description 
      var description = $item.find('description').text(); 
      //don't forget the pubdate 
      var pubDate = $item.find('pubDate').text(); 

      // now create a var 'html' to store the markup we're using to output the feed to the browser window 
      var html = "<div class=\"entry\"><h2 class=\"postTitle\">" + title + "<\/h2>"; 
      html += "<em class=\"date\">" + pubDate + "</em>"; 
      html += "<p class=\"description\">" + description + "</p>"; 
      html += "<a href=\"" + link + "\" target=\"_blank\">Read More >><\/a><\/div>"; 

      //put that feed content on the screen! 
      $('#feed_content').append($(html)); 
     }); 
     $('#feed_content img.loader').fadeOut(); 
    } 

    }); 

}; 

这里的RSS-proxy.php从URL和输出加载XML它：

<?php 
    // PHP Proxy 
    // Loads a XML from any location. Used with Flash/Flex apps to bypass security restrictions 
    // Author: Paulo Fierro 
    // January 29, 2006 
    // usage: proxy.php?url=http://mysite.com/myxml.xml 

    $session = curl_init($_GET['url']);     // Open the Curl session 
    curl_setopt($session, CURLOPT_HEADER, false);   // Don't return HTTP headers 
    curl_setopt($session, CURLOPT_RETURNTRANSFER, true); // Do return the contents of the call 
    $xml = curl_exec($session);       // Make the call 
    header("Content-Type: text/xml");     // Set the content type appropriately 
    echo $xml;  // Spit out the xml 
    curl_close($session); // And close the session 
?> 

Answer 1

我终于设法解决了这个问题！ 事实证明，如果您想对某个域（不管您是本地主机还是其他域）发出请求，您需要将您希望从PhoneGap应用程序请求的服务器列入白名单。 之前我没有发现的原因是我没有检查ajax响应中的错误。一旦我这样做，我得到了http状态代码401（未授权）和错误消息“Whitelist rejected”。

为了解决这个问题我在我的项目打开的文件PhoneGap.plist和下方的按键ExternalHosts我添加了一个新项目，其值为：*.localhost。 我也改变了AJAX网址：

url: 'http://localhost/rssApp/www/rss-proxy.php?url=http://www.nytimes.com/services/xml/rss/nyt/GlobalHome.xml'

我编译和运行在iOS模拟器的应用和我的本地服务器与一个完全成功的Ajax响应回应！

对于希望应用程序连接到的每个外部主机，必须将其添加到ExternalHosts的列表中。例如，如果您希望访问http://google.com/maps/api.php上的API，则必须将*.google.com添加到您的列表中。

有点烦人，当你试图弄清楚为什么服务器没有响应，但我想这是很好的安全原因。希望这可以帮助那些正在从PhoneGap应用程序的简单Ajax请求中挣扎的人！

Answer 2

它看起来像在本地运行服务器（基于192.168.xx IP地址），这意味着只有连接到网络的设备才能访问它。您可以将手机连接到与您的计算机相同的WiFi网络作为临时修复。但是你需要在真正的服务器上托管它，以便通过互联网访问它。

您也可以将路由器上的端口80转发到此IP地址，然后在您的请求url中使用您的实际IP地址（请参阅whatsmyip.org）。但这不是一个真正稳定的解决方案。