CORS在PhoneGap + jQuery Mobile中使用ajax不能在设备上工作，但在浏览器上 [英] CORS using ajax within PhoneGap+jQuery Mobile not working on device but is on browsers

问题描述

所以我正在使用Phone Gap和jQuery mobile构建一个应用程序。

So I'm building an application using Phone Gap and jQuery mobile.

当使用ajax从白名单服务器获取json响应时，我收到一个错误响应。控制台中不显示任何内容。奇怪的是，当测试的应用程序在Web浏览器内工作正常，只有当我启动到我的iphone设备，它抛出一个strop。

When using ajax to get a json response from a whitelisted server I am getting an error response. Nothing is showing in console however. The weird thing is that when testing the app within a web browser it works fine, it's only when I launch to my iphone device that it throws a strop.

现在值得说明的是，我托管我的php脚本的网站在Phone Gap中列出了白名单。我在数组中使用*（只是为了这样做有所不同）。
我已经制定了一个jsonp的解决方法，但不想使用它 - 我觉得如果它在浏览器中工作，它必须是可能的设备上。我希望这是一个简单的修复...

It is worth saying now that the site I'm hosting my php scripts on is white listed within Phone Gap. I am using * in the array (just in case this makes a difference). I have worked out a jsonp workaround for this but don't want to use it - I feel if it's working in browsers it must be possible on the device. I'm hoping it's a simple fix...

这里是我简单的php脚本只是回应一个json字符串。

Here is my simple php script just echoing a json string.

<?php
header('Access-Control-Allow-Origin: *');
$arr = array('a' => 1, 'b' => 2);
echo json_encode($arr);
?>

以下是JS

    $('#registerUser').submit(function() {
          $.ajax({
                 url: 'http://www.mydomain.co.uk/path/register/add_user.php',
                 type: 'post',
                 dataType: 'json',
                 crossDomain : true,
                 timeout: 5000,
                 success: function(msg){
                    alert(msg.a);
                 },
                 error: function(){
                    alert('There was an error loading the data.');
                 }
                 });
          });
    });

编辑：我也有这个js页面上...它推荐在jquery移动文档在使用Phone Gap时使用此方法

edit: I also have this js on the page...it's recommended on the jquery mobile docs to use this when using Phone Gap

        <script>
        $( document ).on( "mobileinit", function() {

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

        </script>

和表格 - 我不认为这是必要的...

And the form - I don't think this is necessary...

           <form id='registerUser' action="" method="POST">
                <div data-role="fieldcontain">
                    <label for="name">Name:</label>
                    <input type="text" name="name" id="name" value=""  />
                    <label for="name">Email:</label>
                    <input type="text" name="email" id="email" value=""  />
                    <label for="name">Password:</label>
                    <input type="password" name="password1" id="password1" value=""  />
                    <label for="name">Re-enter password:</label>
                    <input type="password" name="password2" id="password2" value=""  />
                    <br>
                    <button type="submit" aria-disabled="false">Submit</button>
                </div>
            </form>

感谢您的帮助！

推荐答案

好吧，结果是代码没有问题。它似乎应用程序缓存的错误结果或东西。我杀了应用程序，并重新启动它，一切工作正常现在。从阅读，似乎iOS6 safari缓存POST，这是不同于以前的版本。

Okay so it turns out there wasn't an issue with the code. It seemed that the app was cacheing the error result or something. I killed the app and relaunched it and all works fine now. From reading around it seems iOS6 safari caches POST which is different to previous versions.

我已经在我的ajax调用中添加了这个，以防止缓存POST。

I have added this in my ajax call to prevent caching the POST.

 headers: { "cache-control": "no-cache" }

帮助别人，因为它是一个痛苦！

I hope this helps someone else as it has been a pain!

感谢回复

这篇关于CORS在PhoneGap + jQuery Mobile中使用ajax不能在设备上工作，但在浏览器上的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！