大家好,
我是 AJAX 新手,我在使用 JQuery 1.4.4 和 jquery.form.js AJAX 插件进行同源策略保护时遇到问题。
我有一个 AJAX 联系表格,只要访问者在他们输入的 URL 前加上“www”,它就可以正常工作。但是,如果他们导航到我的网站(不使用 www),URL 仍然可以解析,但 URL 与我在 AJAX 表单中使用的不匹配。在 Chrome 中,这会导致控制台错误:
“XMLHttpRequest 无法加载http://www.example.com/。Access-Control-Allow-Origin不允许来源http://example.com 。”
在 IE8 上,我得到“访问被拒绝”。因此,即使 URL 在有或没有“www”的情况下都可以解析,如果访问者没有以“www”开头,我的 AJAX 表单也将不起作用。如果我将我的 AJAX 表单代码更改为发布到http://example.com(没有“www”),那么如果访问者导航到 www.example.com,它将无法正常工作。我想不出如何让我的代码处理这两种情况。这一定是一个几乎每个人都会遇到谁在使用 AJAX 的问题,而不管使用 JQuery。所以我一定遗漏了一些明显的东西。有人可以教育我吗?我的测试代码如下。
谢谢,
诺斯克
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ajaxForm Error Test</title>
<script src="http://www.example.com/js/jquery-1.4.4.min.js"></script>
<script src="http://www.example.com/js/jquery.form.js"></script>
</head>
<body>
<form id="contact-form" method="post" action="http://this-url-wont-be-used.com/">
<a href="#" id="contact-button">SEND</a>
</form>
<script>
//
// hook up the form to ajax
//
$('#contact-form').ajaxForm({
url: 'http://www.example.com/', // forcing the URL doesn't seem to help!
success: function(data) {
alert(data);
},
dataType: 'html'
});
//
// make the SEND link behave as if it's a submit button
//
$('#contact-button').click(function(e) {
$('#contact-form').submit();
});
</script>
</body>
</html>