jquery.form和跨域请求
我很难尝试使用跨域请求来生成jquery.form。我对Firefox和Chrome有问题(甚至还没有尝试IE )。
说明:我的整个网站都位于http://www.mysite.com内部。但是，我的联系人表单位于另一台服务器上，由http://contact.mysite.com引用。我认为将它放在子域上可以避免涉及跨域请求的问题，但显然没有。http://contact.mysite.com是用辛纳特拉实现的。
我的javascript设置没什么特别之处。表单的操作指向http://contact.mysite.com，方法是POST：
<form id="contact" action="http://contact.mysite.com/" method="post">jquery.form配置了一个ajaxForm调用：
$(document).ready(function() {
$('#contact').ajaxForm({
success: function() { $('#success').fadeIn("slow"); },
error: function() { $('#error').fadeIn("slow"); }
});
});我遇到的第一个问题是Firefox3.5--显然它会发送一个选项请求，期望服务器给出一个具体的答案。我使用这个问题来配置我的Sinatra应用程序，因此它做了预期的事情(看起来最近的sinatra版本包含了一个选项动词)：
require 'rubygems'
require 'sinatra'
require 'pony'
# patch sinatra so it handles options requests - see https://stackoverflow.com/questions/4351904/sinatra-options-http-verb
configure do
class << Sinatra::Base
def options(path, opts={}, &block)
route 'OPTIONS', path, opts, &block
end
end
Sinatra::Delegator.delegate :options
end
# respond to options requests so that firefox can do cross-domain ajax requests
options '/' do
response['Access-Control-Allow-Origin'] = '*'
response['Access-Control-Allow-Methods'] = 'POST'
response['Access-Control-Max-Age'] = '2592000'
end
post '/' do
# use Pony to send an email
Pony.mail(...)
end在jQuery1.4.3中，我在firebug上看到了一个选项请求，后面跟着一个POST请求(状态200 )。电子邮件已发送)。使用jQuery1.3.2或1.5，只显示选项请求(没有发送电子邮件)。
尽管如此，我尝试过的所有版本的jquery都会触发error回调。我将其追溯到$.ajax(...)调用，因此我不确定这个问题是来自jquery.form还是jquery本身。
我尝试记录来自错误的信息：
$('#contact').ajaxForm({
success: function() { $('#success').fadeIn("slow"); },
error: function(jqXHR, textStatus, errorThrown) {
console.log(jqXHR.status);
console.log(jqXHR.statusText);
}
}); JQuery1.4.3上的输出(在发送选项和POST请求之后，状态为200)：
0
(empty string)JQuery1.5上的输出(选项返回后状态为200；从不发送POST )
302
error我真的迷路了。
- 是否有一个插件来处理这个问题？
- 我是不是漏了什么东西？
任何帮助都将不胜感激。
回答 4
Stack Overflow用户
发布于 2011-02-22 08:43:18
AJAX请求不能跨域执行(UPD:不再正确，所有现代浏览器都支持CORS)，但是您可以使用JSONP。尽管JSONP跨域工作，但它不能用于POST请求，您需要将表单的方法更改为get，并使用以下方法：
$('#contact').ajaxForm({
success: function() { $('#success').fadeIn("slow"); },
error: function() { $('#error').fadeIn("slow"); },
dataType: 'jsonp'
});上面的解决方案依赖于您的服务器响应有效的jsonp响应，否则将不会执行success处理程序。例如：response.write(request.callback + '(' + result.to_json + ')')
jQuery的最新版本可以在没有ajaxForm插件的情况下序列化表单。如果不需要文件上传，可以使用以下内容：
$('form').submit(function() {
var url = $(this).attr('action')
var params = $(this).serialize()
$.getJSON(url + '?' + params + "&callback=?", function(data) {
// success
})
return false
});Stack Overflow用户
发布于 2011-02-21 13:00:21
我认为JSONP是唯一能够跨域的AJAX请求。
http://en.wikipedia.org/wiki/JSON#JSONP
Stack Overflow用户
发布于 2011-02-22 09:26:55
您还可以使用本地代理URL来执行请求，因为服务器通常可以使用HttpRequest或cURL之类的方法进行跨域调用。因此，基本上您使用ajax调用本地域上的URL，然后将请求转发到跨域URL，并将来自HttpRequest/cURL的响应从本地域传递回浏览器。
https://stackoverflow.com/questions/5066213
复制相似问题
腾讯云开发者
