3

大家好,

我是 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>
4

2 回答 2

2

域 www.xyz.com 和域 xyz.com 并不相同,因此如果您在 Javascript 文件中硬编码了 url,则会收到此错误。

简短的回答是不要使用相对网址而不是完整网址。你没有显示实际的网址,所以我不能在你的情况下给你一个例子,但可以说域名是 http://www.xyz.com 并且你需要将表格发布到网址 http://www .xyz.com/admin/form/

在您的 JavaScript 中,您使用的 url 是 /admin/form

这样,无论您的访问者使用什么 url 访问您的网站,它都可以正常工作,并且不会导致跨域脚本错误。

当然,如果您的网站是公开的,您可能应该(永久)将您的 xyz.com 网站重定向到 www.xyz.com 网站。因为谷歌和其他搜索引擎认为这两个是不同的域,你的页面排名将在这两个域中划分。

于 2011-01-29T03:46:36.287 回答
0

尝试使用 url 的相对路径url: '/',

于 2011-01-29T03:27:12.257 回答