php - 使用 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 请求只返回 php 文件的内容(php 代码，而不是执行的结果)。

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

这是启动 ajax 代码的 jQuery 代码:

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();
    }

    });

};

这是从 url 加载 XML 并输出它的 rss-proxy.php:

<?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

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

为了解决这个问题，我在我的项目中打开了文件 PhoneGap.plist 并在 ExternalHosts 项下添加了一个新项，其值为:*.localhost 。我还将 ajax url 更改为:

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 请求的其他人!