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:
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.
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://hacks.mozilla.org/2009/07/cross-site-xmlhttprequest-with-cors
Imgur implements Cross-Origin Resource Sharing (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.
See http://hacks.mozilla.org/2009/07/cross-site-xmlhttprequest-with-cors/ for more information.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With