Ajax 请求通过浏览器工作，而不是通过 iOS 或 Android 模拟器中的 Cordova 应用程序

Posted 2023-03-12

【中文标题】Ajax 请求通过浏览器工作，而不是通过 iOS 或 Android 模拟器中的 Cordova 应用程序

【英文标题】：Ajax Request Works via Browser, not via Cordova app in iOS or Android emulators

【发布时间】：2014-11-13 20:23:56

【问题描述】：

我正在构建一个 jQuery Phonegap 应用程序。以下 Ajax 请求在我的浏览器中有效：

<script type="text/javascript">

$(document).bind("mobileinit", function() 
    $.support.cors = true;
    $.mobile.allowCrossDomainPages = true;
);

$(document).ready(function() 

    $.support.cors = true;
    $.mobile.allowCrossDomainPages = true;

    // Load Meet List
    var requestData = 
        'action' : "getmeetlist"
    ;

    $.ajax(
        type    : 'GET',
        url     : 'http://forum.mastersswimmingqld.org.au/swimman/xmltest.php',
        data    : requestData,
        datatype: 'xml',
        encode  : true,
        error: function(xhr, settings, exception)
             alert('The update server could not be contacted.');
        ,
    )

    .done (function(data) 

        // Render data
        $(data).find('meet').each(function()

            var id = $(this).attr("id");
            var meetName = $(this).find('meetname').text();

            var startDate = $(this).find('startdate').text();

            $("#meetlist").append("<li><a id=\"" + id + "\" class=\"meetLink\"><h2>" + meetName + "</h2><p>" + startDate + "</p></a></li>");

        ); 

        $("#meetlist").listview('refresh');

    ); 

但是，当我通过任一模拟器运行它时，它永远不会工作。我的 config.xml 中有以下内容：

<access origin="*" />

有什么建议吗？我已经阅读了有关 Phonegap 应用程序的白名单和 jQuery 页面。无论我做什么，仍然没有运气。我唯一的线索是，当我通过浏览器点击此页面时（特别是如果我通过后退按钮到达），列表不会出现，直到我点击刷新。

我已将这些标头放在生成我的 xml 的 php 中：

header("Access-Control-Allow-Origin: *");
header('Content-type: text/xml');

后一个我放在那里是因为当列表没有出现时，控制台会显示一条消息“格式不正确”，但通常不会显示 AJAX 请求发生的行号。

有什么建议吗？

谢谢，

大卫

【参考方案1】：

我遇到了同样的问题。 ajax 请求作为跨域请求被阻止。我不得不以下列方式使用 jsonp 来解决这个问题。

$.ajax(timeout: 5000,
    url: 'http://yoursite.com/yourscript.php',
    dataType: "jsonp",
    callback: 'callback',
    jsonpCallback: 'yourcallback',
    type: "GET",
    crossDomain: true,
    data: 'scriptinput':'data string you send'
);
function yourcallback(response) 
   console.log(response);

这是一个示例，说明这如何在 PHP 的服务器端为我工作。您需要修改脚本以返回 json。传递 SendAnswer() 一个包含您想要返回的数据的对象。

function SendAnswer($response)  
// Allow from any origin
if (isset($_SERVER['HTTP_ORIGIN'])) 
    header("Access-Control-Allow-Origin: $_SERVER['HTTP_ORIGIN']");
    header('Access-Control-Allow-Credentials: true');

// Access-Control headers are received during OPTIONS requests
if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') 

    if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD']))
        header("Access-Control-Allow-Methods: GET, OPTIONS");         

    if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']))
        header("Access-Control-Allow-Headers:$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']");

header("content-type: application/json");
$callback = filter_input(INPUT_GET, 'callback', FILTER_SANITIZE_SPECIAL_CHARS);
echo  "$callback(" . json_encode($response) . ")";

祝你的项目好运。