我在本地局域网(machineA)上有一台机器,它有两台web服务器.第一个是XBMC内置的(在8080端口)并显示我们的库.第二台服务器是CherryPy python脚本(端口8081),我正在使用它按需触发文件转换.文件转换由来自XBMC服务器提供的页面的AJAX POST请求触发.

  • Goto http://machineA:8080显示图书馆
  • 将显示库
  • 用户点击"转换"链接,发出以下命令-

jQuery Ajax请求

$.post('http://machineA:8081', {file_url: 'asfd'}, function(d){console.log(d)})
  • 浏览器发出带有以下标题的HTTP选项请求;

Request Header - OPTIONS

Host: machineA:8081
User-Agent: ... Firefox/4.01
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 115
Connection: keep-alive
Origin: http://machineA:8080
Access-Control-Request-Method: POST
Access-Control-Request-Headers: x-requested-with
  • 服务器响应如下:;

Response Header - OPTIONS (STATUS = 200 OK)

Content-Length: 0
Access-Control-Allow-Headers: *
Access-Control-Max-Age: 1728000
Server: CherryPy/3.2.0
Date: Thu, 21 Apr 2011 22:40:29 GMT
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: POST, GET, OPTIONS
Content-Type: text/html;charset=ISO-8859-1
  • 然后对话就停止了.理论上,当服务器用正确的(?)响应时,浏览器应该发出POST请求CORS标题(访问控制允许来源:)

为了排除故障,我还从http://jquery.com发出了相同的$.post命令.这就是我被难住的地方,来自jquery.com的POST请求起作用,OPTIONS请求紧跟在POST之后发送.此事务的标题如下;

Request Header - OPTIONS

Host: machineA:8081
User-Agent: ... Firefox/4.01
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 115
Connection: keep-alive
Origin: http://jquery.com
Access-Control-Request-Method: POST

Response Header - OPTIONS (STATUS = 200 OK)

Content-Length: 0
Access-Control-Allow-Headers: *
Access-Control-Max-Age: 1728000
Server: CherryPy/3.2.0
Date: Thu, 21 Apr 2011 22:37:59 GMT
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: POST, GET, OPTIONS
Content-Type: text/html;charset=ISO-8859-1

Request Header - POST

Host: machineA:8081
User-Agent: ... Firefox/4.01
Accept: */*
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 115
Connection: keep-alive
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
Referer: http://jquery.com/
Content-Length: 12
Origin: http://jquery.com
Pragma: no-cache
Cache-Control: no-cache

Response Header - POST (STATUS = 200 OK)

Content-Length: 32
Access-Control-Allow-Headers: *
Access-Control-Max-Age: 1728000
Server: CherryPy/3.2.0
Date: Thu, 21 Apr 2011 22:37:59 GMT
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: POST, GET, OPTIONS
Content-Type: application/json

我不明白为什么同一个请求在一个站点上有效,而在另一个站点上无效.我希望有人能指出我遗漏了什么.谢谢你的帮助!

推荐答案

我最终偶然发现了这个链接"A CORS POST request works from plain javascript, but why not with jQuery?",它指出jQuery 1.5.1添加了

 Access-Control-Request-Headers: x-requested-with

所有CORS请求的标头.jQuery 1.5.2没有这样做.另外,根据同一问题,将服务器响应头设置为

Access-Control-Allow-Headers: *

不允许响应继续.您需要确保响应标头明确包含所需的标头.即:

Access-Control-Allow-Headers: x-requested-with 

Jquery相关问答推荐

jQuery找到最近的匹配元素

如何在 jQuery 中 Select 特定的表单元素?

Bootstrap 4 多选下拉菜单

提交前添加 POST 参数

JavaScript 或 jQuery 字符串以实用函数结尾

将变量传递给jQuery AJAX成功回调中的函数

.trigger() 与 .click() 中的 jQuery 优势/差异

扩展 jQuery 插件的最佳方式

jQuery 库中使用的设计模式

jQuery中追加的相反

如何在 jQuery .each() 的每次迭代之间添加暂停?

jQuery .load() 调用不会在加载的 HTML 文件中执行 JavaScript

使用 jQuery 验证插件自定义日期格式

Underscore.js 和 jQuery 互补吗?

如何在页面加载时启动 jQuery Fancybox?

如何使用 jQuery 删除 cookie?

jQuery - 添加 ID 而不是类

在 Firefox 上开发的 Javascript 在 IE 上失败的典型原因是什么?

如何使用 bootstrap 中的 selectpicker 插件在 Select 时设置选定值

JQuery 判断 DOM 中的重复 id