跨域ajax请求是如何工作的?

I'm looking at this question and in it is a link to http://hacks.mozilla.org/2011/03/the-shortest-image-uploader-ever/ which has the following code:

我正在看这个问题，里面有一个链接到http://hacks.mozilla.org/2011/03/the shortestimage -uploader-ever/，它有以下代码:

var fd = new FormData();
fd.append("image", file); // Append the file
fd.append("key", "6528448c258cff474ca9701c5bab6927");
// Get your own key: http://api.imgur.com/

// Create the XHR (Cross-Domain XHR FTW!!!)
var xhr = new XMLHttpRequest();
xhr.open("POST", "http://api.imgur.com/2/upload.json"); // Boooom!
xhr.onload = function() {
    // Big win!
    // The URL of the image is:
    JSON.parse(xhr.responseText).upload.links.imgur_page;
 }
 // Ok, I don't handle the errors. An exercice for the reader.
 // And now, we send the formdata
 xhr.send(fd);

How does this cross domain request work? I thought as a rule there are security restrictions that stop people from doing just this.

这个跨域请求是如何工作的?我认为作为一个规则，有安全限制阻止人们这么做。

2 个解决方案

#1

The server is reponding with the Access-Control-Allow-Origin set to allow cross domain requests

服务器正在使用访问控制允许的源集进行修复，以允许跨域请求

Response Headers
Access-Control-Allow-Origin: *  
Cache-Control   max-age=604800
Connection  keep-alive
Content-Length  494
Content-Type    application/json

http://www.w3.org/TR/cors/#access-control-allow-origin-response-hea

http://www.w3.org/TR/cors/ access-control-allow-origin-response-hea

http://hacks.mozilla.org/2009/07/cross-site-xmlhttprequest-with-cors

#2

Imgur implements Cross-Origin Resource Sharing (CORS).

Imgur实现了跨源资源共享(CORS)。

The CORS standard works by adding new HTTP headers that allow servers to serve resources to permitted origin domains. Browsers support these headers and enforce the restrictions they establish. Additionally, for HTTP request methods that can cause side-effects on user data (in particular, for HTTP methods other than GET, or for POST usage with certain MIME types), the specification mandates that browsers “preflight” the request, soliciting supported methods from the server with an HTTP OPTIONS request header, and then, upon “approval” from the server, sending the actual request with the actual HTTP request method. Servers can also notify clients whether “credentials” (including Cookies and HTTP Authentication data) should be sent with requests.

CORS标准的工作是添加新的HTTP头，允许服务器为允许的源域提供资源。浏览器支持这些标头并执行它们所建立的限制。此外,HTTP请求方法会导致用户数据上的副作用(尤其是对HTTP方法,除了得到,或与某些MIME类型)后使用,规范要求浏览器“起飞”请求,请求从服务器支持方法与HTTP请求头选项,然后在“批准”从服务器,发送实际的请求与实际HTTP请求方法。服务器还可以通知客户端“凭据”(包括cookie和HTTP身份验证数据)是否应该随请求一起发送。

See http://hacks.mozilla.org/2009/07/cross-site-xmlhttprequest-with-cors/ for more information.

更多信息请参见http://hacks.mozilla.org/2009/07/cross-site-xmlhttprequest-with-cors/。

#1