javascript - jQuery跨域图片上传

Question

好的，基本上就是这样。 我将一些 javascript 代码注入(inject)到网页中，并将该页面上的图像上传到另一台服务器。 现在，当我在我的域上运行它时(当然)，它可以工作，但我需要将 multipart/form-data 请求发布到我不拥有的 PHP 文件。 由于它是上传而不是获取数据的简单请求，因此我无法在初始调用中使用 jsonp，因为响应不会采用 json 格式。

使用 James Padolsey 的跨域脚本，我可以跨域执行 $.get 和 $.post 请求，但由于我使用 $.ajax 它不起作用。 He uses the Yahoo Query Language to acomplish this

这基本上就是我提出请求的方式

$.ajax({
url: 'http://website.com/upload.php',
type: 'POST',
contentType:'multipart/form-data',
data: postData,
success: successCallback,
error : function(XMLHttpRequest, textStatus, errorThrown) {
    console.log('Error');
}
});

我想让它完全基于 JavaScript，以避免让我的服务器执行请求。 回顾一下，我可以获取图像字节并使用 JavaScript 发出请求。但到目前为止，我无法使其跨域，因为我使用 $.ajax 将内容类型设置为“multipart/form-data”。 有没有其他方法可以使请求跨域(带或不带 YQL)？

使用 iframe 发出请求将不起作用，因为 iframe 的域会更改，并且我将无法访问响应。

Answer 1

这是 Web 开发中一个众所周知的难题，称为 Same Origin Policy

Javascript prevents access to most methods and properties to pages across different origins. The term "origin" is defined using the domain name, application layer protocol, and (in most browsers) port number of the HTML document running the script. Two resources are considered to be of the same origin if and only if all these values are exactly the same.

有几种方法可以解决这个问题。

1. Create your own proxy
   • 创建一个页面，仅将请求转发到其他服务器并返回其响应
   • 或者，使用 Apache 的规则形成代理(参见上面的链接)
2. 使用别人的代理
   • 对于典型的 GET 请求 Use YQL to access yahoo's proxy
   • 对于 POST 请求，如果第 3 方支持 Open Data Tables
   • 或者，使用其他公共(public)代理
3. 查看第 3 方是否符合 CORS规范
   • Cross domain POST query using Cross-Origin Resource Sharing getting no data back
4. 如果您愿意在页面上允许一点闪光，请尝试flXHR
   • 它声称实现了精确的 XHR api，并且还有一个 jquery plugin

这些几乎是你唯一的选择