关于javascript：Access-Control-Allow-Origin不允许使用Origin


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

我正在向Sencha Touch 2应用程序(包装在PhoneGap中)中的远程PHP服务器创建Ajax.request。

服务器的响应如下：

XMLHttpRequest cannot load http://nqatalog.negroesquisso.pt/login.php. Origin http://localhost:8888 is not allowed by Access-Control-Allow-Origin.

我该如何解决这个问题？

相关讨论

我前段时间写了一篇关于这个问题的文章，跨域AJAX。

如果您控制响应服务器，最简单的方法是为以下内容添加响应标头：

1
Access-Control-Allow-Origin: *

这将允许跨域Ajax。在PHP中，您需要修改响应，如下所示：

1
<?php header('Access-Control-Allow-Origin: *'); ?>

您只需将Header set Access-Control-Allow-Origin *设置放在Apache配置或htaccess文件中即可。

应该注意的是，这有效地禁用了CORS保护，这很可能会使您的用户受到攻击。如果您不知道您特别需要使用通配符，则不应使用它，而应将特定域列入白名单：

1
<?php header('Access-Control-Allow-Origin: http://example.com') ?>
相关讨论

如果您无法控制服务器，只需将此参数添加到Chrome启动器：--disable-web-security即可。

请注意，我不会将此用于正常的"网上冲浪"。有关参考，请参阅此帖子：在Chrome中停用相同的来源政策。

您可以使用Phonegap实际构建应用程序并将其加载到设备上，这不是问题。

相关讨论

如果你正在使用Apache，只需添加：

1
2
3
<ifModule mod_headers.c>
    Header set Access-Control-Allow-Origin: *
</ifModule>

在您的配置中。这将导致您的网络服务器的所有回复都可以从互联网上的任何其他网站访问。如果您打算仅允许特定服务器使用主机上的服务，则可以将*替换为原始服务器的URL：

1
Header set Access-Control-Allow-Origin: http://my.origin.host
相关讨论

如果您有ASP.NET / ASP.NET MVC应用程序，则可以通过Web.config文件包含此标头：

1
2
3
4
5
6
7
8
9
10
11
<system.webServer>
  ...

    <httpProtocol>
        <customHeaders>
            <!-- Enable Cross Domain AJAX calls -->
            <remove name="Access-Control-Allow-Origin" />
           
        </customHeaders>
    </httpProtocol>
</system.webServer>
相关讨论

这是我尝试使用ASP.NET MVC作为我的数据源解决相同问题时出现的第一个问题/答案。我意识到这并没有解决PHP问题，但它足够相关，有价值。

我正在使用ASP.NET MVC。 Greg Brant的博客文章为我工作。最后，您创建一个属性[HttpHeaderAttribute("Access-Control-Allow-Origin","*")]，您可以将其添加到控制器操作中。

例如：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
public class HttpHeaderAttribute : ActionFilterAttribute
{
    public string Name { get; set; }
    public string Value { get; set; }
    public HttpHeaderAttribute(string name, string value)
    {
        Name = name;
        Value = value;
    }

    public override void OnResultExecuted(ResultExecutedContext filterContext)
    {
        filterContext.HttpContext.Response.AppendHeader(Name, Value);
        base.OnResultExecuted(filterContext);
    }
}

然后使用它：

1
2
3
4
5
[HttpHeaderAttribute("Access-Control-Allow-Origin","*")]
public ActionResult MyVeryAvailableAction(string id)
{
    return Json("Some public result" );
}
相关讨论

由于Matt Mombrea对于服务器端是正确的，您可能会遇到另一个问题，即白名单拒绝。

您必须配置phonegap.plist。 (我使用旧版本的phonegap)

对于cordova，命名和目录可能会有一些变化。但步骤应该大致相同。

首先选择支持文件> PhoneGap.plist

enter image description here

然后在"ExternalHosts"下

添加一个条目，其值可能为"http://nqatalog.negroesquisso.pt"
我正在使用*仅用于调试目的。

enter image description here

在使用各种AP??I时，我已经遇到过这种情况。通常快速解决方法是添加"＆callback =？"到一个字符串的结尾。有时，＆符必须是字符代码，有时是"？"："？callback =？" (请参阅使用jQuery的Forecast.io API用法)

对于需要对引荐来源的"www"和"非www"版本进行例外处理的任何人来说，这可能很方便：

1
2
3
4
5
6
7
8
9
10
11
12
 $referrer = $_SERVER['HTTP_REFERER'];
 $parts = parse_url($referrer);
 $domain = $parts['host'];

 if($domain == 'google.com')
 {
         header('Access-Control-Allow-Origin: http://google.com');
 }
 else if($domain == 'www.google.com')
 {
         header('Access-Control-Allow-Origin: http://www.google.com');
 }
相关讨论

我将为您提供一个简单的解决方案。在我的情况下，我无法访问服务器。在这种情况下，您可以更改Google Chrome浏览器中的安全策略，以允许Access-Control-Allow-Origin。这很简单：

  • 创建Chrome浏览器快捷方式
  • 右键单击快捷图标 - >属性 - >快捷方式 - >目标

    • 简单粘贴在"C:\Program Files\Google\Chrome\Application\chrome.exe" --allow-file-access-from-files --disable-web-security中。

    位置可能不同。现在点击该快捷方式打开Chrome。

    相关讨论

    如果你在apache下，只需使用以下内容将.htaccess文件添加到你的目录：

    1
    2
    3
    4
    5
    Header set Access-Control-Allow-Origin: *

    Header set Access-Control-Allow-Headers: content-type

    Header set Access-Control-Allow-Methods: *

    如果您正在编写Chrome扩展程序并收到此错误，请确保已将API的基本URL添加到manifest.json的权限块中，例如：

    1
    2
    3
    "permissions": [
       "https://itunes.apple.com/"
    ]

    在Ruby on Rails中，您可以在控制器中执行以下操作：

    1
    headers['Access-Control-Allow-Origin'] = '*'
    相关讨论

    这是因为同源政策。有关Mozilla Developer Network或Wikipedia的更多信息，请参阅。

    基本上，在您的示例中，您只需要从nqatalog.negroesquisso.pt而不是localhost加载http://nqatalog.negroesquisso.pt/login.php页面。

    相关讨论

    您可以通过在HTTP OPTIONS的响应中包含标题Access-Control-Allow-Origin: *的broswer来使其无需修改服务器。

    在Chrome中，使用此扩展程序。如果你在Mozilla上，请检查这个答案。

    如果你在Angular.js中得到它，那么请确保你像这样转义你的端口号：

    1
    2
    3
    4
    5
    var Project = $resource(
        'http://localhost\\:5648/api/...', {'a':'b'}, {
            update: { method: 'PUT' }
        }
    );

    有关详细信息，请参见此处。

    在chrome中测试的phonegap应用程序也存在同样的问题。
    在打开Chrome之前，我们每天在批处理文件下面使用一台Windows机器
    请记住，在运行此操作之前，您需要清除任务管理器中的所有chrome实例，或者您可以选择chrome以不在后台运行。

    批处理:(使用cmd)

    1
    cd D:\Program Files (x86)\Google\Chrome\Application\chrome.exe --disable-web-security

    在Ruby Sinatra

    1
    response['Access-Control-Allow-Origin'] = '*'

    适合所有人或

    1
    response['Access-Control-Allow-Origin'] = 'http://yourdomain.name'

    当您收到请求时，您可以

    1
    var origin = (req.headers.origin ||"*");

    比你必须做出回应的那样：

    1
    2
    3
    4
    5
    6
    7
    res.writeHead(
        206,
        {
            'Access-Control-Allow-Credentials': true,
            'Access-Control-Allow-Origin': origin,
        }
    );