Question

我正在尝试从HTML5应用程序向本地Web服务器发出简单的AJAX请求。但是，因为客户端代码不是从网络服务器提供的，所以我得到了 “Access-Control-Allow-Origin”不允许“原点为null”错误。

我已尝试过以下帖子中描述的所有内容，但仍然无效：XmlHttpRequest error: Origin null is not allowed by Access-Control-Allow-Origin

如果我在Internet托管的服务器上发布我的服务器代码，则客户端应用程序可以运行。但我希望它可以与我在同一台笔记本电脑上运行的本地MAMP服务器一起使用。

1）在本地网络服务器上，我将以下内容添加到我的PHP控制器中：

header('Access-Control-Allow-Origin: *');

2）这是我的HTML5客户端应用。由于服务器支持CORS，因此不需要JSONP。

<html>

<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.js"></script>
    <base href='http://192.168.15.12/'></base> <!-- local MAMP server -->     
    <script>

        $(document).ready(function() {
                $('#leadButton').click(function(){

                    $.getJSON(
                        'get/leaderboard',
                        function(data){
                            var leader;

                            leader = "<div> The top leader is from local webserver is: " +  data[0].name + "</div>";
                            $('#leaderboard').append(leader);
                            console.log(data);
                        }
                    );     
                });
        });
    </script>
</head>

<body>
    <div id="leaderboard">Leaderboard
        <button id="leadButton">Get Leaderboard</button>
    </div>
</body>

3）当我从Chrome调用客户端应用程序（文件：///Users/John/Desktop/index.html），然后单击“leadButton”按钮时，会出现以下结果请求/响应标头：

Request URL:http://192.168.15.12/get/leaderboard
Request Method:OPTIONS
Status Code:403 Forbidden

Request Headers
Access-Control-Request-Headers:Origin, X-Requested-With, Accept
Access-Control-Request-Method:GET
Origin:null

Response Headers
Connection:Keep-Alive
Content-Length:227
Content-Type:text/html; charset=iso-8859-1
Date:Thu, 03 Nov 2011 19:03:27 GMT
Keep-Alive:timeout=5, max=100
Server:Apache

我错过了什么？谢谢你的帮助。

Answer 1

我发现了问题：

对本地网络服务器（192.168.15.12）的请求需要在$ .getJSON请求中指定的完整URL：“http://192.168.15.12/get/leaderboard”

“base”标记没有在jQuery调用中的URL前面加上“http://192.168.15.12/”。

我还需要将以下Apache配置添加到我的.htaccess文件中以启用跨源资源共享（CORS）（在PHP中执行此操作无法可靠地工作）：

 Header set Access-Control-Allow-Origin *

Answer 2

accesing：

file:///Users/John/Desktop/index.html

不起作用。因为file：///与localhost不同。

您需要访问http://192.168.15.12/index.html才能使其正常工作

无法从HTML5应用程序向本地Web服务器调用AJAX

2 个答案: