MooTools CORS请求与原生JavaScript

18 浏览
0 Comments

MooTools CORS请求与原生JavaScript

我有这段MooTools代码：

new Request.JSON({
  method: 'POST',
  url: URL, /*URL TO ANOTHER DOMAIN*/
  onSuccess: function(r){
    callback(r);
  }
}).post(data);

这段代码不发送POST请求（只有OPTIONS）...

看下面的代码（它工作得很好）：

var http = null,
  params = Object.toQueryString(data);
try {
  http = new XMLHttpRequest();
} catch (e) {
  try {
    http = new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
    try {
      http = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (e) {
      http = null;
      alert("您的浏览器不支持AJAX！");
    }
  }
}
var url = URL;
http.onreadystatechange = function () {
  if (http.readyState == 4 && http.status == 200) {
    var jsonData = JSON.parse(http.responseText); /*OR EVAL*/
    callback(jsonData);
  }
};
http.open("POST", url);
http.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
http.send(params);

编辑：

尝试过：.setHeader('Content-Type','application/x-www-form-urlencoded');

仍然没有...可能出了什么问题？

谢谢！

0

2 答案

0 Comments

MooTools CORS请求与原生JavaScript之间的区别

在使用MooTools进行CORS请求时，可能会遇到一些问题。这是因为MooTools会将一些额外的内容捆绑到请求头中。例如，如果你的htaccess文件中包含以下内容：

Header set Access-Control-Allow-Origin: *

那么你需要按照以下方式创建你的请求：

var foo = new Request({
    url: 'http://fragged.org/Epitome/example/data/',
    method: 'get',
    onComplete: function (data) {
        // 返回一个包含姓名和姓氏的对象
        new Element('div[html="{name} {surname}"]'.substitute(JSON.decode(data))).inject(document.body);
    }
});
// 需要移除该行代码，否则CORS请求将需要与之匹配
delete foo.headers['X-Requested-With'];
foo.send();

这就是为什么你只看到了OPTIONS预检请求。它不喜欢你 🙂

你可以修改.htaccess文件，让它也匹配X-Requested-With，这可能是一种额外的“安全”措施。

你可以查看http://jsfiddle.net/7zUSu/1/中的一个示例，我在一段时间前遇到了这个问题，当时我想修复这个Request问题。

非常好的答案！谢谢。

我不知道该如何感谢你，这可能为我节省了数小时的抓狂时间。

0
0 Comments

MooTools CORS请求与原生JavaScript之间的差异

MooTools是一个流行的JavaScript库，用于简化Web开发中的一些常见任务。在使用MooTools进行CORS（跨域资源共享）请求时，与使用原生JavaScript相比，可能会出现一些差异。

问题的出现原因

在MooTools和原生JavaScript的例子中，两者都发送了POST请求，唯一的区别在于Accept请求头。MooTools发送的是Accept: application/json，而原生JavaScript发送的是Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8。这可能会影响服务器的响应。

解决方法

要解决这个问题，我们可以通过修改原生JavaScript代码来将Accept请求头设置为application/json，以使其与MooTools的请求一致。这样服务器就会按照相同的方式响应请求。

以下是修改后的原生JavaScript代码示例：

var xhr = new XMLHttpRequest();
xhr.open('POST', 'https://example.com/api', true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.setRequestHeader('Accept', 'application/json');
xhr.send(JSON.stringify(data));

通过将Accept请求头设置为application/json，我们确保服务器按照预期的方式进行响应。

总结

MooTools和原生JavaScript在CORS请求中的差异可能会导致服务器响应的不同。解决这个问题的方法是通过修改原生JavaScript代码，将Accept请求头设置为与MooTools请求一致的值。这样可以确保服务器以相同的方式对待这些请求，从而解决任何由差异引起的问题。

0