Question

我正在本地虚拟主机（http://foo.app:8000）上运行角度应用。它正在使用$http.post向另一个本地VirtualHost（http://bar.app:8000）发出请求。

$http.post('http://bar.app:8000/mobile/reply', reply, {withCredentials: true});

在Chrome开发者工具的网络标签中，我当然会看到OPTIONS请求，并且响应中包含标题：

Access-Control-Allow-Origin: http://foo.app:8000

但是，POST请求将被取消，并显示以下错误：

请求的资源上没有“Access-Control-Allow-Origin”标头。因此，不允许原点“http://foo.app:8000”访问。

有没有人经历过这个？ Access-Control-Allow-Origin标头非常清楚地包含在OPTIONS请求的响应中，所以我不能为我的生活找出为什么POST正在执行标头丢失。

Access-Control-Allow-Credentials也设置为true。

Answer 1

这是本地开发者的chrome中的一个错误。尝试其他浏览器。然后它会工作。

Answer 2

对于想要使用Chrome的用户，有一种解决方法。 This extension允许您从任何来源请求任何包含AJAX的网站，因为它会在响应中添加'Access-Control-Allow-Origin: *'标头。

作为替代方案，您可以将此参数添加到Chrome启动器：--disable-web-security。请注意，我仅将其用于开发目的，而不是用于正常的“网上冲浪”。有关参考，请参阅Run Chromium with Flags。

最后一点，通过安装第一段中提到的扩展，您可以轻松启用/禁用CORS。

Answer 3

我使用$ http服务向http://localhost:8090/上运行的bottle发送了angularjs的请求，我不得不申请CORS，否则我收到了“No'Access-Control-Allow等请求错误-Origin'标题出现在请求的资源“

上

from bottle import hook, route, run, request, abort, response

#https://github.com/defnull/bottle/blob/master/docs/recipes.rst#using-the-hooks-plugin

@hook('after_request')
def enable_cors():
    response.headers['Access-Control-Allow-Origin'] = '*'
    response.headers['Access-Control-Allow-Methods'] = 'POST, GET, OPTIONS, PUT'
    response.headers['Access-Control-Allow-Headers'] = 'Origin, X-Requested-With, Content-Type, Accept'

Answer 4

我遇到了同样的问题。对我来说，OPTIONS请求会通过，但POST请求会说“已中止”。这让我相信浏览器根本就没有发出POST请求。 Chrome在请求标头中显示了“警告临时标头”，但未显示任何响应标头。最后我转向调试Firefox，这让我发现我的服务器响应错误，响应中没有CORS头。 Chrome实际上正在接收响应，但不允许在网络视图中显示响应。

Answer 5

CROS需要从服务器端解决。

根据要求创建过滤器以允许访问并在web.xml中添加过滤器

使用spring的例子：

过滤类：

@Component
public class SimpleFilter implements Filter {

@Override
public void init(FilterConfig arg0) throws ServletException {}

@Override
public void doFilter(ServletRequest req, ServletResponse resp,
                     FilterChain chain) throws IOException, ServletException {

    HttpServletResponse response=(HttpServletResponse) resp;

    response.setHeader("Access-Control-Allow-Origin", "*");
    response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
    response.setHeader("Access-Control-Max-Age", "3600");
    response.setHeader("Access-Control-Allow-Headers", "x-requested-with");

    chain.doFilter(req, resp);
}

@Override
public void destroy() {}

}

Web.xml中：

<filter>
    <filter-name>simpleCORSFilter</filter-name>
    <filter-class>
        com.abc.web.controller.general.SimpleFilter
    </filter-class>
</filter>
<filter-mapping>
    <filter-name>simpleCORSFilter</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>

Answer 6

我今天遇到了这个问题。事实证明，服务器上的一个错误（空指针异常）导致它在创建响应时失败，但它仍然生成了200状态代码。由于200状态代码，Chrome需要一个有效的响应。 Chrome做的第一件事就是寻找它没有找到的'Access-Control-Allow-Origin'标题。 Chrome然后取消了请求，Angular给了我一个错误。处理POST请求期间的错误是OPTIONS成功的原因，但POST会失败。

简而言之，如果您看到此错误，则可能是您的服务器根本没有返回任何标头以响应POST请求。

Answer 7

当您的参数在请求中出错时，也会发生这种情况。在我的情况下，我正在使用API向我发送消息

“请求资源上没有'Access-Control-Allow-Origin'标头。因此，不允许来源'null'。响应具有HTTP状态代码401。”

当我使用POST请求发送错误的用户名或密码登录时。

Answer 8

而不是使用 $ http.get （'abc / xyz / getSomething'）尝试使用的 $ http.jsonp （ 'ABC / XYZ / getSomething'）

return{ getList:function(){ return $http.jsonp('http://localhost:8080/getNames'); } }

Answer 9

如果你们在sails.js中遇到这个问题，只需将你的cors.js设置为包含授权作为允许的标题

/***************************************************************************
  *                                                                          *
  * Which headers should be allowed for CORS requests? This is only used in  *
  * response to preflight requests.                                          *
  *                                                                          *
  ***************************************************************************/

  headers: 'Authorization' // this line here

AngularJS没有检测到Access-Control-Allow-Origin标头？

9 个答案: