jQuery移动应用程序ajax调用给出错误

时间:2013-03-02 10:22:14

标签: jquery ajax cordova jquery-mobile mobile

我正在使用phonegap android开发一个应用程序。当我运行这段代码时,它会给出以下错误

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" />
        <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>
        <title>Insert title here</title>

        <script>
            (function($) {

                $.fn.getPageData = function() {
                    var finalData = "";

                    $.ajax({
                        url : "Demo url.com",
                        type : "GET",
                        success : function(data) {

                            finalData = '<div id="index" data-role="page" data-url="index" tabindex="0" class="ui-page ui-body-c ui-page-active" style="min-height: 386px;"><div data-role="header" class="ui-header ui-bar-a" role="banner"><h3 class="ui-title" role="heading" aria-level="1">First Page</h3></div></div>';

                        },
                        fail : function() {
                            finalData = '<div id="index" data-role="page" data-url="index" tabindex="0" class="ui-page ui-body-c ui-page-active" style="min-height: 386px;"><div data-role="header" class="ui-header ui-bar-a" role="banner"><h3 class="ui-title" role="heading" aria-level="1">Error Page</h3></div></div>';

                        }
                    });
                    this.append(finalData);

                };

            })(jQuery);
            $(document).ready(function() {

                $('body').getPageData();
                //$(a).appendTo("body");
            });
        </script>

    </head>
    <body>

    </body>
</html>

出现以下错误。

Origin null is not allowed by Access-Control-Allow-Origin.

2 个答案:

答案 0 :(得分:0)

如果您执行Ajax呼叫,则首先向服务器发送OPTIONS呼叫,以便检测它是否允许跨源资源共享。如果返回的标题不允许这样,则会出现这样的错误。

您是否可以尝试将localhost(或服务器本身)用于演示网址?

检查您的网络标签。

您可以在以下位置了解有关CORS的更多信息: http://en.wikipedia.org/wiki/Cross-origin_resource_sharing http://hacks.mozilla.org/2009/07/cross-site-xmlhttprequest-with-cors/

关于同源政策: http://en.wikipedia.org/wiki/Same_origin_policy

答案 1 :(得分:0)

尝试将http://localhost(或任何您的localhost网址)添加到“外部主机”下的phonegap.plist文件中。它可能会存在于您的支持文件目录中。